how do you make a sliding drop down menu?

Jas123

macrumors member
Original poster
Apr 1, 2008
97
0
Such as on some event, a menu drops down with the same effects as pulling down a window shade.



I am also wondering how do you make an image/object follow your mouse cursor?
 

bootedbear

macrumors 6502
Sep 13, 2004
373
0
Austin, TX
A JavaScript library such as jQuery would make this almost trivial. Check out the slideDown() method (and of course there's a corresponding slideUp() method).

As for making an item follow the cursor, establish a mousemove event handler on the body and grab the mousemove coordinates. Move the position of the element accordingly (also pretty easy with something like jQuery).
 

THX1139

macrumors 68000
Mar 4, 2006
1,928
0
I am also wondering how do you make an image/object follow your mouse cursor?
I wouldn't advise doing that unless you're making some type of game or interaction for a purpose. Having stuff follow your cursor on a website is annoying and completely out of style. It was all the rage back in the Geocities days and when everyone was first doing Flash based websites. Nowadays... cheesy.
 

designguy79

macrumors 6502
Sep 24, 2009
306
2
Michigan
Also, make sure that your menu is backwards compatible with browsers who don't support JavaScript (or for people who leave it turned off by default!). A lot of screen readers, mobile phones and search engine bots don't have a "hover" state.

If you can't make the main menu non-JS compatible, at least make the links available somewhere else on the page (footer, for example).

This is the one I love:

http://www.lwis.net/free-css-drop-down-menu/

I modified it slightly to work with the jQuery plug-in "hover intent" (link below) so that if their mouse "slips" off for a half a second, they don't have start over.

http://cherne.net/brian/resources/jquery.hoverIntent.html

HTH