1. Computer problem? Tech Support Guy is completely free -- paid for by advertisers and donations. Click here to join today! If you're new to Tech Support Guy, we highly recommend that you visit our Guide for New Members.

javascript drop down menu help

Discussion in 'Software Development' started by dbimen, Feb 16, 2007.

Thread Status:
Not open for further replies.
  1. dbimen

    dbimen Thread Starter

    Joined:
    Jul 16, 2006
    Messages:
    121
    I am having trouble with a javascript menu dropdown that I got off the internet. I've altered it a little to fit my needs but I would like to do something that after taking many javascript classes, I can't figure out how.

    I want to make the drop down menu item's font color green by default, and then on mouseover have the font turn YELLOW and the backgroun turn GREEN. The menus will be using arrays, and I am having trouble altering the code to work.

    I've attached the code that I am developing the menu bars on.
     

    Attached Files:

    • code.txt
      File size:
      12.6 KB
      Views:
      208
  2. Gibbs

    Gibbs

    Joined:
    Feb 28, 2005
    Messages:
    609
    It's a simple fix. Create a CSS class inside your <style> tags. For an example I created this:
    HTML:
    a.test:active, a.test:link, a.test:visited
    {
    	color:green;
    }
    
    a.test:hover
    {
    	color:yellow;
    }
    Then add the class name inside your hyperlinks like this:
    HTML:
    //Contents for menu 2, and so on
    
    var about=new Array()
    
    about[0]='<a href="/history.htm" class="test"><b>History & Mission</b></font></a>'
    
    about[1]='<a href="/directions.htm" class="test"><font color="green"><b>Directions</b></font></a>'
    
    about[2]='<a href="/facultydirectory.htm" class="test"><font color="green"><b>Faculty Directory</b></font></a>'
    It worked fine for me in Firefox on Linux.

    The reason your attempt did not work, I think, is because you are telling the text to become yellow when the object (not text) is hovered. I don't know Javascript so I could be completely wrong but the method above works :).

    Edit: Another thing to take note on. It's not good practice to add a forward-slash (/) when linking to files in the same directory.
     
  3. dbimen

    dbimen Thread Starter

    Joined:
    Jul 16, 2006
    Messages:
    121
    this worked perfectly... I had the right idea of how to code it in my attempts, but wasn't implementing it correctly.

    Thanks for your help.
     
As Seen On
As Seen On...

Welcome to Tech Support Guy!

Are you looking for the solution to your computer problem? Join our site today to ask your question. This site is completely free -- paid for by advertisers and donations.

If you're not already familiar with forums, watch our Welcome Guide to get started.

Join over 733,556 other people just like you!

Thread Status:
Not open for further replies.

Short URL to this thread: https://techguy.org/544728

  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice