I am making a 3 layer navigation and the mobile menu won't work. Sub Menu disappears every time I try to hover or click on a link
When I hover on top of the appliance link the sub menu will appear but when I try to hover on top of the appliances listed within that submenu, the sub menu will disappear. Please someone help.
<ul id="navMenu">
<!-- OUTDOOR KITCHENS MENU -->
<li class="nav-item">
<a href="#" class="nav-link">Outdoor Kitchens</a>
<ul class="kitchen-sub-items second-layer">
<li>
<a href="#">Appliances</a>
<ul class="third-layer">
<li><a href="#" class="nav-link">LYNX</a></li>
<li><a href="#" class="nav-link">COYOTE</a></li>
<li><a href="#" class="nav-link">CROWN VERITY</a></li>
<li><a href="#" class="nav-link">HESTAN</a></li>
<li><a href="#" class="nav-link">BIG GREEN EGG</a></li>
<li><a href="#" class="nav-link">ALFRESCO</a></li>
<li><a href="#" class="nav-link">FIRE MAGIC</a></li>
<li><a href="#" class="nav-link">PERLICK</a></li>
<li><a href="#" class="nav-link">EVO</a></li>
<li><a href="#" class="nav-link">FONTANA</a></li>
<li><a href="#" class="nav-link">WOLF</a></li>
<li><a href="#" class="nav-link">BLAZE</a></li>
</ul>
</li>
<li><a href="#">CABINETRY</a></li>
<li><a href="#">COUNTERTOPS</a></li>
</ul>
</li>
<!-- CABANA X MENU ITEM -->
<li><a href="#" class="nav-item">CabanaX</a></li>
<!-- PERGOLA X MENU -->
<li>
<a href="#" class="nav-item">PergolaX</a>
<ul class="second-layer">
<li><a href="#">SMART PERGOLA ACCESSORIES</a></li>
<li><a href="#">SMART PERGOLAS</a></li>
<li><a href="#">WHY STRUXURE PERGOLAS</a></li>
</ul>
Via Active questions tagged javascript - Stack Overflow https://ift.tt/c7G8lvS
Comments
Post a Comment