470Views8Replies

Author Options:

How does one make pull out list in HTML? Answered

For example, there's a list of links down the left hand side, when you hover over it more links pop out the side. I'll try explain in ASCII:

[Text]
[Text] > [Text]
[Text]    [Text]
[Text]    [Text] >[Link]
              [Text]   [Link]
                          [Link]


A link to a website with this featured on it would be fine, just so I can go view source.

8 Replies

user
JayefuuBest Answer (author)2010-03-13

Ignore Zero and Kelsey. You don't need javascript :) HTML and CSS can be used to make a popout list as you describe.

Google "Nested CSS Menu"

http://www.howtocreate.co.uk/tutorials/testMenu.html

Select as Best AnswerUndo Best Answer

user
Kryptonite (author)Jayefuu2010-03-13

Awesome, thanks!

I gave up trying to look for a website with this, went to do some other homework and found that my school website uses it!

It's effectively a link, and the hover-over option pulls down the other bits. If you click it, it goes no where, and in the html it says onclick="noreturn".

Select as Best AnswerUndo Best Answer

user
kelseymh (author)Jayefuu2010-03-13

Except that, as documented on that Web page, it's not quite conforming HTML either.  In the best case, it gets ignored, and in the worst, it get mangled.

Select as Best AnswerUndo Best Answer

user
orksecurity (author)Jayefuu2010-03-13

Interesting. However, the point about accessibility to folks who are following the Web via screen-readers may still be valid.

Select as Best AnswerUndo Best Answer

user
wiggster (author)2011-04-25

Try DynamicDrive, they have loads of cool menus which you can add to your site.

Select as Best AnswerUndo Best Answer

user
gmxx (author)2010-03-13

 Its done with javascript. check dynamicdrive.com.  they have a nice library of html/js/css code, with a number of pull down menus scripts. download one, and edit to suit your needs. the only requirement is that you have a comment in the source code saying you  got the code from dynamic drive.

Select as Best AnswerUndo Best Answer

user
kelseymh (author)2010-03-12

As Ork said, that's not done with HTML at all.  It's JavaScript, which means it is not accessible to anyone who can't use a high-end graphical browser.  If you're blind, you can't use it.

Select as Best AnswerUndo Best Answer

user
orksecurity (author)2010-03-12

Can't be expressed in HTML alone. You'd need to do some scripting.

Simpler might be to find another way to express that selection.

Select as Best AnswerUndo Best Answer