我有一个简单的下推菜单,但是当您单击它们时链接会关闭菜单 - 当您浏览它们时它们会突出显示,当您单击它们时它们也会突出显示但是菜单只是关闭而不移动到所选页面?
#nav-mobile {
display: block;
padding-top: 12px;
height: auto;
min-height: 33px;
overflow: hidden;
font-size: 0.9em;
background: none;
}
#nav-mobile, #nav-mobile ul, #nav-mobile li {
position: relative;
background: none;
}
#nav-mobile ul {
margin: 0;
padding: 0;
width: 100%;
background: none;
}
#nav-mobile ul li {
width: 100%;
display: block;
padding: 13px 0 13px 0;
margin: 0;
background: none;
}
#nav-mobile ul a:hover {
background: none;
}
#nav-mobile ul li:hover {
background: none;
}
<script type="text/javascript">
$(document).ready(function() {
$('#nav-mobile ul').hide();
$('#nav-mobile').click(function(e) {
e.preventDefault();
$('#nav-mobile ul').slideToggle();
});
});
</script>
<div id="nav-mobile">
<a href="#">Menu</a>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="services.html">Services</a></li>
<li><a href="whyus.html">Why us?</a></li>
<li><a href="faqs.html">FAQs</a></li>
<li><a href="careers.html">Career</a></li>
<li id="last-child"><a href="contactus.html">Contact us</a></li>
<li id="last-child"><a href="#">Portal</a></li>
</ul>
</div>
最佳答案
e.preventDefault();
阻止链接 - 删除它!
容器的点击事件总是先触发 - 所以滑动切换也可能是个问题!
关于javascript - 按下菜单链接不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22785658/