Results 1 to 2 of 2

Thread: jQuery Multi Level CSS Menu #2 - Slight Problem

  1. #1
    Join Date
    Jan 2010
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Arrow jQuery Multi Level CSS Menu #2 - Slight Problem

    For some reason, the hover for the sub menu's is not working or I have done something wrong.

    designbyily.com/api/index.html You can see that the menu is working (links have not been activated) and the tabs have the hover effect working. But when you go to the sub menus, the hover effect does not seem to appear.

    Would anyone know what I may be doing wrong?

    .jqueryslidemenu{
    font: bold 13px Verdana;

    padding: 50px;
    }

    .jqueryslidemenu ul{
    margin: 0;
    padding: 0;
    list-style-type: none;
    }

    /*Top level list items*/
    .jqueryslidemenu ul li{
    position: relative;
    display: inline;
    float: left;
    background: transparent; /*background of tabs (default state)*/


    }

    /*Top level menu link items style*/
    .jqueryslidemenu ul li a{
    display: block;

    color: #f7e7b4;
    padding: 8px 10px;
    border-right: 1px solid #5f8700;
    color: #2d2b2b;
    text-decoration: none;
    }

    * html .jqueryslidemenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
    display: inline-block;
    }

    .jqueryslidemenu ul li a:link, .jqueryslidemenu ul li a:visited{
    color: white;
    }

    .jqueryslidemenu ul li a:hover{
    background: #f7c92b; /*tab link background during hover state*/
    color: white;
    }

    /*1st sub level menu*/
    .jqueryslidemenu ul li ul{
    position: absolute;
    left: 0;
    display: block;
    visibility: hidden;
    }

    /*Sub level menu list items (undo style from Top level List Items)*/
    .jqueryslidemenu ul li ul li{
    display: list-item;
    float: none;
    }

    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
    .jqueryslidemenu ul li ul li ul{
    top: 0;
    }

    /* Sub level menu links style */
    .jqueryslidemenu ul li ul li a{
    font: normal 13px Verdana;
    width: 160px; /*width of sub menus*/
    padding: 5px;
    margin: 0;
    border-top-width: 0;
    border-bottom: 1px solid white;
    background: #f7c92b;
    }

    .jqueryslidemenuz ul li ul li a:hover{ /*sub menus hover style*/
    background: #eff9ff;
    color: black;
    }


    /* ######### CSS classes applied to down and right arrow images ######### */

    .downarrowclass{
    position: absolute;
    top: 12px;
    right: 7px;
    }

    .rightarrowclass{
    position: absolute;
    top: 6px;
    right: 5px;
    }

  2. #2
    Join Date
    Jan 2010
    Posts
    9
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Never mind...I figured it out.

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
  •