SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Heeeelp please!! stoping hover on current page

    Hi I hoped soemone could point me in the right direction for this.
    Basically my template creates a unique id in it's flat menu list so it can display a defferent BG for the current page

    class="mainlevelmainnav" id="active_menumainnav">Product Info</a></li>

    I want to stop the hover effect working when the mouse rolls over the current page menu item.

    This is my menu stylesheet

    #mainlevelmainnav {
    width: 100%;
    float: left;
    margin: 0 0 0em 0;
    padding: 0;
    list-style: none;
    background-color: transparent;

    }
    #mainlevelmainnav li {
    float: left; }
    #mainlevelmainnav li a {
    display: block;
    padding: 8px 15px;
    text-decoration: none;
    font-weight: normal;
    color: #036;
    font-size:16px

    }
    #mainlevelmainnav li a:hover {
    color: #000;
    background-color: #fff;
    text-decoration: underline;
    }
    a:hover#active_menumainnav {
    background:#CCC}

    Thanks any help appreciated

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The syntax of the last selector is invalid – pseudo-classes must come last – and it is not specific enough to override the previous selector either.

    Change the last rule to this,
    Code CSS:
    #mainlevelmainnav a#active_mainmenunav:hover {
      background-color:#ccc;
    }
    Birnam wood is come to Dunsinane

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

    Assuming the id is added to the anchor that contains the current item then you would need to do something like this:

    Code:
    #mainlevelmainnav li a#active_menumainnav:hover {
        background:#CCC
    }
    Also assuming that #ccc is the link background color.

    Edit:


    Tommy beat me

  4. #4
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    wow thanks for the quick reply i just spent an hour or so trying to work that out for myself...you rock


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
  •