Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Aug 2006
    Posts
    15
    Thanks
    0
    Thanked 1 Time in 1 Post

    Question Drop-Down List Menu

    I'm perplexed by this, knowing there is a possible way for it to work, though, I must be doing something wrong. I'll post my two thoughts on the methods, and if you can somehow debunk it, I would be greatly thankful.

    CSS

    li {display:none}
    li:hover {display:block}

    HTML

    <ul>List
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    </ul>


    Method 2

    CSS

    li {display:none}

    HTML

    <ul onmouseover="li.style='display:block'" onmouseout="li.style='display:none'">List
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    </ul>


    I'm trying to make a drop-down menu with this, but it doesn't seem to be working. Thank you in advance for any help.
    Last edited by SyntaxError; 12-08-2006 at 05:06 AM.

  • #2
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    To start with the word "List" is invalid where it is and so may be interfering (only <li> tags can go inside a <ul> everything else has to go inside the <li>s).

    Also what browser are you using as Internet Explorer 6 doesn't understand :hover unless it is a part of a:hover.

    Finally your Javascript in method 2 is coded wrongly - it needs to be:

    Code:
    onmouseover="var li = document.getElementsByTagName('li');for (var i = 0; i < li.length; i++) li[i].style.display = 'block';"
    and similarly for the onmouseout
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #3
    New Coder
    Join Date
    Aug 2006
    Posts
    15
    Thanks
    0
    Thanked 1 Time in 1 Post
    Thank you again, for helping me, cudos. I would, however, like that javascript explained so I can use that for other elements, as well. Thank you.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •