Forum Moderators: open

Message Too Old, No Replies

Javascript Drop Down Menu

         

benj0323

5:06 am on Jul 11, 2004 (gmt 0)

10+ Year Member



I've been researching some drop down menus and haven't found a decent one.

Does anyone here know of a reliable, non excessive, drop down menu script?

One that is cross browser compatible and isnt a million lines of code.

Thanks for the help.

korkus2000

3:04 pm on Jul 11, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Take a look at this and see if it is what you are looking for.

[webmasterworld.com...]

Rambo Tribble

3:15 pm on Jul 11, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Something to bear in mind is that, in this age of browser exploits utilizing JavaScript, more and more visitors are likely to have JS turned off. I'm seeing it on my site and I bet most others are, too.

There are CSS-only ways to approximate the JS drop-down, but, of course, they don't play well with version 4 browsers. It sort of leaves you with a conundrum on the horns of a dilemma. The bottom line is that drop-downs are risky business. And that's without even addressing accessibility issues.

Noisehag

6:53 pm on Jul 11, 2004 (gmt 0)

10+ Year Member



Something to bear in mind is that, in this age of browser exploits utilizing JavaScript, more and more visitors are likely to have JS turned off. I'm seeing it on my site and I bet most others are, too.

Just so happens that I have a client that wants this type of menu system. Oh the timing...

If I absolutely position the js menu over the top of a non-js menu, I should have both js and non-js users covered. Not really that much extra work.

mlwindy

12:44 am on Jul 12, 2004 (gmt 0)

10+ Year Member



I have been searching the web for a good drop menu and found one at [dynamicdrive.com...]

I am wanting to put two menus on the same page so i can have a menu and the top and bottom. I am a newbie at things and dont know how to go about doing this sadly. For this particular menu i cannot figure out how to do rollover text and iframe. Which is what i really need. Does anyone know of another menu to use? I was using CSS but i am leaning more to javascript.

Noisehag

2:40 am on Jul 12, 2004 (gmt 0)

10+ Year Member



The only problems with the menus that are already out there:

1) Copyright issues
2) Trying to get relative positioning
3) Understanding their scripts well enough to manipulate to everyone's needs

I'm trying to create a functional drop down menu based on code I found right here at Webmaster World. Credits will be given on end product for sure. Hopefully, with a little help, I'll have something to post for everyone to modify without worry of copyright infringement. Surely with the wealth of talent here, we will have something very soon.

Not trying to taunt, just want to create good open source script made to cater to all of us.

mlwindy

5:13 am on Jul 12, 2004 (gmt 0)

10+ Year Member



hey that sounds excellent definently let us know when it is finished, i hope soon, id be the first to use :) I might just go back to css menus for now and dont want to be so picky, but everyone has different needs and people charge such outrageous prices for menu scripts it however makes me want to learn coding more and more so i dont have to bother with the debt.
Hope to see the script soon!

createErrorMsg

4:07 pm on Jul 12, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Just so happens that I have a client that wants this type of menu system

I'm curious what your client thinks a JS menu will give him/her that a CSS one will not. The only limitation I know of is that CSS drop menus have issues when they go more than one layer deep (well, plus ie5mac mangles them), but let's face it, if you're trying to drop your menus more than one layer, it's time to reconsider your approach to info-architecture, yes?

Noisehag

7:30 pm on Jul 12, 2004 (gmt 0)

10+ Year Member



I'm curious what your client thinks a JS menu will give him/her that a CSS one will not.

Quite honestly I did not know that it could be done purely in css. I'm sure I've come across it browsing around, but I would have been none the wiser. Do any examples come to mind that I could take a peek at?

The only limitation I know of is that CSS drop menus have issues when they go more than one layer deep (well, plus ie5mac mangles them), but let's face it, if you're trying to drop your menus more than one layer, it's time to reconsider your approach to info-architecture, yes?

Yes and no. I like to give my clients what they ask for (within reason of course) and as long as they know what the risks and limitations are up front then we can move forward.

This particular client is in real estate and part of the navigation would actually go two levels deep for property listings. >>Properties>>Region>>City I've already gathered all the links for this section and I must say that it will distribute out nice and evenly. For those without JS on, the parent menu would still be visible so clicking on >>Properties would take them to the >>Region page and so on. I thought about doing a site map style format for this section, but they insist upon having the drop down menu at the top. Oh well, they put food on my table and beer in my belly, so I'm happy to accommodate them. :)

createErrorMsg

4:20 pm on Jul 13, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



The best resource i know of, although certainly not the only one, for CSS drop menus is A List Apart. Offhand, I know of three articles there that could help you determine if a purely CSS drop menu will work. By title, they are...

Taming Lists
Suckerfish Dropdowns
and
Dropdown Menus ,Horizontal Style

They are all very good articles.

Actually, true cross-browser functionality requires a touch of JS anyway (I believe it's about a dozen lines or so to get them working in, you guessed it, IE!) but in my book it beats four and a half solid pages of JS that can so easily be deactivated, rendering the whole thing useless. At least a CSS drop menu with JS disabled (a) works in compliant browsers (IE's problem is it's inability to apply the hover pseudoclass to anything but links) and (b) still displays the top level links in IE with JS off.

Something to think about.

I've never taken a drop menu more than one layer, so I can't say from experience or authority how they work in that regard. I have read references to a 2 layer limitation but, again, I can't say for sure how true it is.

Noisehag

6:45 pm on Jul 13, 2004 (gmt 0)

10+ Year Member



Hey mlwindy and benj0323, for a quick solution for what you would like to do, I found that Tigra Menu is pretty good. You should be able to find it through Google. Seems that if you simply leave the copyright comments in, you can use it for any site. They also have a menu builder application to help speed up the process. After that it's just modifying the styles to your liking and then positioning.