Advanced Search Usage Terms Submit Contact
Dynamic Drive CSS Library
 
CSS Library
Submit an original CSS code
CSS Layouts
Web Graphics
Online Tools:

Advertise Here

CSS Library: Horizontal CSS Menus: Here

jQuery Multi Level CSS Menu #2

Author: Dynamic Drive

This is a multi-level horizontal CSS menu created using a regular nested HTML list, then turned into a fully functional drop down menu using CSS and a touch of jQuery. The sub menus slide in and out into view, which also automatically reposition themselves horizontally if too close to the window's right edge.

Demo:

Important: Make sure your page contains a valid doctype for this menu to render properly.

The external files: The menu requires the following support files, which you should upload by default all to the same directory as your page itself:

If you wish to upload the above files to a different directory, be sure to edit "jqueryslidemenu.js" to update the URLs to the two arrow images used.

The CSS/ JavaScript: The below code should be added to the HEAD section of your page:

The HTML:

Code Info

Rate this code:

Date Posted: 11/03/2008

Revision History: Nov 8th, 08': Limit # of queued animations to prevent animation stuttering

Usage Terms: Click here

Your Comments (187)

Got a question or need help customizing this CSS code? Post it in the CSS Forums. If you have a comment or suggestion instead, post it in the comments section below.

Comment Pages 14 of 19 pages « First  <  12 13 14 15 16 >  Last »

Hi guys. He who is not very strong in memory should not meddle with lying.
I am from Sri and also now am reading in English, please tell me right I wrote the following sentence: "Find the most inexpensive and cheap flights and airline tickets at flight network, offering the best last."

Waiting for a reply ;-), Karine.
Posted by Karine on 03/20, 11:55 PM
Give please. The information found by me on this site appeared very useful. Thanks to the owner. Help me! Can not find sites on the: Comprehensive, unbiased airline ticket resource for - domestic and international margaux flights is a comprehensive and unbiased airline ticket resource.. I found only this - Airline Tickets. Tripdesigns airline tickets to serbia, airline tickets to croatia, airline tickets to bosnia, airline tickets to eastern europe, call milica obradovic. Com cheapest airline tickets and hotels worldwide and other san francisco, ca local merchants. Best regards :o, Sagara from Ghana.
Posted by Sagara on 03/22, 02:21 AM
Awesome job man, thanks alot this menu solved my problem. While I was trying to setup a popup menu from DW, it was always getting wrong positions at ie, but your jquery menu saved the day. :)
Posted by Alysson Paladini on 03/28, 01:30 AM
i am not able to use the above code, please give me the proper instruction or specification of image url in jquery.js file.
Posted by ahmed on 03/30, 02:22 AM
hi i dont know how to upload the files.can u tell me how to upload the two files and where i have to upload the two files.
Posted by kiran kumar on 04/02, 06:31 AM
Hi, I really appreciate this work! It's very easy to configure coz of the detailed instructions :)

Just a suggestion though, would be very great if the slide menu has an option to slide up instead of just dropping down.

Thanks!
Posted by Shintah on 04/02, 08:26 PM
Hello, I also think taht this menu is wonderful but i have a little problem ... On my site below the menu i put the search form with standard input text box and when slide down list from menu, move mouse directly on input text box menu from slide down lsit, slide list don't up,than block and wait for over the slide down list again but on clear place on site ... If you dont understand, you can see it on www.4zida.rs , go - prodaja - (slide down) kuce - and move mouse right on text input box .

Thank you
Posted by Mike on 04/03, 06:48 AM
Love the script and I was able to use it without any problems. Also works great on all browsers. Kudos!

One thing I'm struggling with: I can't get the absolutely positioned submenu (ul li ul) to align where I want to from the top. It seems no matter what I set it to (top: 23px;) it remains at 0.

Any clue?
Posted by pixie on 04/05, 09:40 AM
Can somebody provide me a hint on how to make the menus slide up? Is this possible? Sorry for the dumb question, quite new to JS..
Posted by Shintah on 04/05, 07:52 PM
Cool, just got the menus sliding up now! ;) I just added this line to the if-else condition in jqueryslidemenu.js of line 35:
$targetul.css("top", -this._dimensions.subulh + "px");
Posted by Shintah on 04/05, 08:46 PM

Comment Pages 14 of 19 pages « First  <  12 13 14 15 16 >  Last »


Commenting is not available in this weblog entry.
Copyright 2006-2014 Dynamic Drive Read our Usage Terms before using any of the CSS codes.