Results 1 to 2 of 2

Thread: Smooth Navigational Menu (v1.4)

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

    Default Smooth Navigational Menu (v1.4)

    1) Script Title: Smooth Navigational Menu (v1.4)

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm

    3) Describe problem: I posted a problem I had earlier, and I have managed to come up with a couple of work arounds, somehow. At the moment I need to somehow differentiate the colour of the main menu text and the sub menu text.

    I am inserting the code into Goldfish, if that's any help.

    Any help would be very gratefully received!

    HTML Code:
    .ddsmoothmenu{
    font: normal 14px Calibri;
    background: transparent; /*background of menu bar (default state)*/
    color: black;
    width: 75%;
    text-decoration: none;
    }
    
    .ddsmoothmenu ul{
    z-index:100;
    margin: 0;
    padding: 0;
    list-style-type: none;
    }
    
    /*Top level list items*/
    .ddsmoothmenu ul li{
    position: relative;
    display: inline;
    float: left;
    }
    
    /*Top level menu link items style*/
    .ddsmoothmenu ul li a{
    display: block;
    background: Transparent; /*background of menu items (default state)*/
    color: white;
    padding: 8px 10px;
    border-right: 0px solid #000000;
    color: white;
    text-decoration: none;
    }
    
    * html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
    display: center-block;
    }
    
    .ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{
    color: bold, white;
    font: normal 13px Calibri;
    }
    
    .ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
    background: black; 
    color: white;
    font: normal 13px Calibri;
    }
    
    .ddsmoothmenu ul li a:hover{
    background: black; /*background of menu items during onmouseover (hover state)*/
    color: white;
    font: bold 13px Calibri;
    }
    	
    /*1st sub level menu*/
    .ddsmoothmenu ul li ul{
    display: block;
    background: white;
    position: absolute;
    left: 0;
    display: none; /*collapse all sub menus to begin with*/
    visibility: hidden;
    }
    
    /*Sub level menu list items (undo style from Top level List Items)*/
    .ddsmoothmenu ul li ul li{
    display: list-item;
    background: #000000;
    color: bold, white
    float: none;
    }
    
    /*All subsequent sub menu levels vertical offset after 1st level sub menu */
    .ddsmoothmenu ul li ul li ul{
    top: 0;
    }
    
    /* Sub level menu links style */
    .ddsmoothmenu ul li ul li a{
    font: normal 13px Calibri;
    width: 160px; /*width of sub menus*/
    padding: 5px;
    margin: 0;
    border-top-width: 0;
    border-bottom: 1px solid gray;
    }
    
    /* Holly Hack for IE \*/
    * html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/
    }

  2. #2
    Join Date
    Aug 2004
    Posts
    9,918
    Thanks
    3
    Thanked 969 Times in 957 Posts
    Blog Entries
    15

    Default

    You should be able to give your sub menu links a different color by targeting the CSS rule:

    Code:
    .ddsmoothmenu ul li ul li a{
    
    }
    Using the default ddsmoothmenu.css file as an example, the new addition in red would give the sub menu links a color of yellow:

    Code:
    /* Sub level menu links style */
    .ddsmoothmenu 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 gray;
    color: yellow !important;
    }
    DD Admin

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
  •