这是我的网站:http://lowandheavy.com 问题是,当网站在移动设备中打开时,名称为“women”的第二个菜单不像菜单“men”那样工作。
它打开下拉菜单,但立即重定向到子菜单 3。这是代码:
<ul class="nav-menu navigation-tier navigation-tier-primary" data-navigation-tier-primary>
<li class="has-slide-out header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="/" >Home</a>
</li>
<li class="dropdown has-slide-out header-navigation-item navigation-item-primary">
<a class="dropbtn navigation-link-primary" href="#">Men</a>
<div class="dropdown-content">
<a href="/men/tanks/">Tanks </a>
<a href="/men/tshirts">T-shirts</a>
</div>
</li>
<li class="dropdown has-slide-out header-navigation-item navigation-item-primary">
<a class="dropbtn navigation-link-primary" href="#">Women</a>
<div class="dropdown-content">
<a href="/women/leggings/">Leggings</a>
<a href="/women/tanks">Tanks</a>
<a href="/women/tshirts">T-shirts</a>
<a href="/women/tshirts/v-neck/">V-Neck</a>
<a href="/women/unisex-tees/">Unisex Tees</a>
</div>
</li>
<li class="has-slide-out header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="/hats/" >Hats</a>
</li>
<li class="has-slide-out header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="/about/" >About</a>
</li>
<li class="has-slide-out header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="/contact-us/" >Contact</a>
</li>
<li class="has-slide-out header-navigation-item navigation-item-primary">
<a class="navigation-link-primary" href="/news-feed/" >News</a>
</li>
</ul>
最佳答案
Lets DO the same on click
/***Add css in file***/
.dropdown.active .dropdown-content {
display: block;
}
/***Add Jquery in file***/
$('.navigation-link-primary').click(function(e){
$('.dropdown').removeClass('active');
$(this).parent().addClass('active');
});
关于javascript - 移动菜单下拉问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50367878/