Results 1 to 4 of 4

Hybrid View

  1. #1
    Join Date
    Jun 2006
    Location
    Providence
    Posts
    137
    Plugin Contributions
    0

    Default CSS dropdown menu

    I'm looking to turn the Category Tab nemu into a dropdown menu. I tried adding this to the css

    Code:
      /*START Navigation Category*/
    
    #navCatTabs li {
      /*float the main list items*/
      margin: 0;
      background-color: #339900;
      float: left;
      display: block;
      padding-right: 15px;
    }
    
    #navCatTabs li.category-top ul, #navCatTabs li.category-NEXT ul {
      /*hide the subnavs*/
      display: none;
      background-color: #339900;
      position: absolute;
      top: 33px;
      height: 15px;
      left: 0;
      padding-top: 10px;
    
    }
    
    #navCatTabs li a {
      /*for all links in the list*/
      color: #f90;
      font-weight: bold;
      display: block;
      height: 15px;
      width: 100px;
      border: 0px;
      padding: 5px;
    }
    
    
    #navCatTabs li.category-top a {
      /*change border color for active topic area*/
      border: 1px solid #f90;
    }
    
    #navCatTabs li.category-top ul a, #nav li.category-NEXT ul a {
      /*  cancel inherit of border
          on subnav of active topic */
      border: 0;
    }
    
    #navCatTabs li.category-top ul {
      /*display active subnav list*/
      display: block;
    }
    
    #navCatTabs li.category-top ul a, #navCatTabs li.category-NEXT ul a {
      float: left;
      /*ie doesn't inherit the float*/
      border: 0;
      color: #f90;
      width: auto;
      margin-right: 15px;
    }
    
    #navCatTabs li.category-top ul {
      /*display the current topic*/
      display: block;
    }
    
    #navCatTabs li.category-NEXT:hover ul {
      /*  display the other topics when
          their parent is hovered */
      display: block;
      z-index: 6000;
    }
    
    #navCatTabs li.category-NEXT a:hover, #nav li.category-NEXT:hover a {
      background: #339900;
      color: #f90;
    }
    
    
      /*END OF Navigation Category*/
    Still no dropdown. Am I missing something? Do I have to go into the template file?

  2. #2
    Join Date
    Aug 2005
    Location
    Arizona
    Posts
    27,755
    Plugin Contributions
    9

    Default Re: CSS dropdown menu

    I'm looking to turn the Category Tab nemu into a dropdown menu. I tried adding this to the css

    Still no dropdown. Am I missing something? Do I have to go into the template file?
    Yes css is only for styling it does not create code to make this an ul list

    You aparently did not look in the free software addon link
    I searched for "css dropdown"
    http://www.zen-cart.com/index.php?ma...oducts_id=1448
    Zen-Venom Get Bitten

  3. #3
    Join Date
    Jun 2005
    Location
    Cumbria, UK
    Posts
    10,266
    Plugin Contributions
    3

    Default Re: CSS dropdown menu

    A cat-tabs dropdown like HERE, for example?
    20 years a Zencart User

  4. #4
    Join Date
    Jun 2006
    Location
    Providence
    Posts
    137
    Plugin Contributions
    0

    Default Re: CSS dropdown menu

    Thanks guys. That was exactly what I was looking for! How easy.

 

 

Similar Threads

  1. Categories dropdown menu/css
    By KenshiroU in forum Templates, Stylesheets, Page Layout
    Replies: 2
    Last Post: 5 Apr 2013, 01:04 PM
  2. CSS Dropdown menu question
    By nolsowski in forum All Other Contributions/Addons
    Replies: 1
    Last Post: 22 Aug 2011, 08:06 PM
  3. Header Dropdown Menu (CSS) Without the Dropdown???
    By hcd888 in forum Templates, Stylesheets, Page Layout
    Replies: 0
    Last Post: 27 May 2009, 01:20 AM
  4. css dropdown menu
    By eaddesigns in forum All Other Contributions/Addons
    Replies: 1
    Last Post: 21 Aug 2008, 11:43 PM
  5. CSS Horizontal Drop Down menu - dropdown menu width...
    By intrium in forum All Other Contributions/Addons
    Replies: 0
    Last Post: 19 Aug 2008, 06:48 PM

Posting Permissions

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