Jump to content

  • Log In with Google      Sign In   
  • Create Account

[web] Basic javascript for a list-based menu


Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.

  • You cannot reply to this topic
3 replies to this topic

#1 outRider   Members   -  Reputation: 852

Like
0Likes
Like

Posted 21 May 2006 - 03:49 PM

I haven't done any web programming in the last 10 years or so, so forgive me if this is question is simple or misguided. I have a div, that contains a set of nested, unordered lists. The div has a CSS class which styles the lists like a basic menu: the top-level list is rendered inline, all other lists are rendered block, it should look like your application menu. I've tried writing a script to do this, and it works somewhat, but I have a feeling there are better ways that I'm not aware of. So, I figured I'd ask, and rely on the experience of others. Here's what I need. -I'd like to change the lists without having to change the script, and add new items to the list without having to remember to add event handlers. (Don't know how to do this, right now I handle the mouseover/mouseout events directly in the HTML). -Whenever the user hovers over a <li> that contains a <ul>, the <ul> should be displayed (did this by manipulating the element's style attribute). -Whenever the user leaves the <li>, the displayed <ul> should be hidden again, unless the user leaves to hover over the <ul> or it's decendants... i.e. if the user leaves the <li> but is in a nested menu three levels down, all menus should remain visible (No idea how to get this working... though IE6 seems to keep the sub-menu open while the mouse is over it, FF hides it when I leave the owner <li>). -Must work on the usual suspects: IE5.5/6, Gecko-based, Opera, etc. All I need are some starting points for the above, I'll be happy to do the hard work myself, but I really don't know where to start since the last time I touched this stuff.

Sponsor:

#2 Sander   Members   -  Reputation: 1328

Like
0Likes
Like

Posted 21 May 2006 - 05:57 PM

Read Suckerfish dropdowns. No javascript, all CSS (except for IE ofcourse).

<hr />
Sander Marechal<small>[Lone Wolves][Hearts for GNOME][E-mail][Forum FAQ]</small>


#3 jflanglois   Members   -  Reputation: 1020

Like
0Likes
Like

Posted 21 May 2006 - 06:07 PM

Quote:
Original post by Sander
Read Suckerfish dropdowns. No javascript, all CSS (except for IE ofcourse).


Agreed. Or Hybrid CSS Dropdowns, depending on what you're aiming for.

#4 outRider   Members   -  Reputation: 852

Like
0Likes
Like

Posted 21 May 2006 - 07:24 PM

Very nice, thanks. I knew about :hover, and knew IE didn't support it, so I figured a single JS solution would be the easiest thing. It's nice to know I was on the right track at least, I was attempting to do something similar to what those guys are doing, though not nearly as polished.




Old topic!
Guest, the last post of this topic is over 60 days old and at this point you may not reply in this topic. If you wish to continue this conversation start a new topic.



PARTNERS