SitePoint Sponsor

User Tag List

Results 1 to 6 of 6
  1. #1
    SitePoint Addict LiveTronix's Avatar
    Join Date
    Sep 2001
    Location
    Vancouver
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    List Item Mouseover - Change Inner Link Color

    So I am trying to do something:

    <script type="text/javascript">
    $("div#Menu ul li").mouseover(function()
    {
    alert(this.localName);
    $(this.localName + " a").addClass("aMenuClass");
    });
    </script>

    <div id="Menu">
    <ul>
    <li><a href="index.php">Home</a></li>
    <li><a href="howitworks.html">How it Works</a></li>
    <li><a href="toppicks.html">Top Picks</a></li>
    <li><a href="articles/index.html">Articles</a></li>
    <li><a href="<?php echo $Myself ["Blog"]; ?>">Blog</a></li>
    <li><a href="faq.html">FAQ</a></li>
    </ul>
    </div>

    Do I have to give each element a unique id, or is there a way to make it work?

  2. #2
    SitePoint Addict LiveTronix's Avatar
    Join Date
    Sep 2001
    Location
    Vancouver
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Note - I am using jQuery...

  3. #3
    In memoriam gold trophysilver trophybronze trophy Dan Schulz's Avatar
    Join Date
    May 2006
    Location
    Aurora, Illinois
    Posts
    15,476
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Just use CSS instead.

  4. #4
    SitePoint Addict LiveTronix's Avatar
    Join Date
    Sep 2001
    Location
    Vancouver
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'd be happy to use CSS. What code do I use?

    http://www.plasticiq.com

  5. #5
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,339
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    HI,

    If you are just trying to change the background color and the anchor color then do it all from the anchor like this:

    Code:
    #Menu ul li
    {
        list-style-type: none;
        width: 140px;
        float: left;
        /*padding: 5px;*/
        border: solid 1px #E9E9E9;
        text-transform: uppercase;
        text-align: center;
    }
    /*#Menu ul li:hover
    {    background: #0f349d;
    
    }*/
    #Menu ul li a 
    {
        color: #0f349d;
        font-weight: bold;
        text-decoration: none;
        display:block;
        position:relative;
        padding: 5px;
    }
    #Menu ul li a:hover {
        color: #FFFFFF;
        background: #0f349d;
    }

  6. #6
    SitePoint Addict LiveTronix's Avatar
    Join Date
    Sep 2001
    Location
    Vancouver
    Posts
    370
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks Paul! That worked like a charm...


Bookmarks

Posting Permissions

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