Forum Discussion

nakul's avatar
nakul
Ace
9 years ago

Navigation Toggle Css

Can anyone tell toggle css for navigation

  • Claudius's avatar
    Claudius
    Boss
    9 years ago
    Hi,
    Can you clarify what you are looking for? The breadcrumb navigation of your community? Easiest is maybe if you can share a screenshot of the element you are trying to style.
    • irach15's avatar
      irach15
      Maven
      8 years ago

      Claudius,

      I have a question about 'toggle' class too ;-)

      We are re-designing our site main navigation to be a Mega Nav.

      Simplified code:

      <div class="main-nav">
    <ul>
        <li class="dropdown menu-catID"><a href="#" class="dropdown-toggle">Top Category<i class="fa fa-angle-down"></i></a>


          <div class="dropdown-menu">  
                <div>
                  <a class="category-item" href="#" <i class="fa fa-angle-right"></i>Sub Category</a>
                 
                </div>  
                <div>
                  <a class="category-item" href="#" <i class="fa fa-angle-right"></i>Sub Category</a>
                 
                </div>  
                <div>
                  <a class="category-item" href="#" <i class="fa fa-angle-right"></i>Sub Category</a>                 
                </div> 
            </div>
        </li>
    </ul>
</div>

      The question is:

      - how to over-write drop-down toggle behavior 'drop on hover' to 'open on click', stay open and close on click?

      - how to debug Lithium js to see what I need over-write?

      - if I just get rid off 'toggle' class, it messes up everything.

      - I tried using Bootstrap, too much work to debugg and layout issues...

      note: we have same functionality as Lithium community ;-)

      • sunny_mody's avatar
        sunny_mody
        Advisor
        8 years ago

        Hi irach15,

         

        If my understanding is correct you want to open dropdown menus on click and not on hover.

        Fot that there is a setting at below link
        communityURL/t5/user/myprofilepage/tab/user-preferences%3Adisplay
        You need to disable check box for "Display menus dynamically with mouse over"