首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >如何在单击导航链接后关闭响应式导航下拉菜单

如何在单击导航链接后关闭响应式导航下拉菜单
EN

Stack Overflow用户
提问于 2013-10-28 00:24:27
回答 1查看 840关注 0票数 0

这是我用来导航的代码。

代码语言:javascript
运行
复制
<nav id="nav" class="clearfix">
    <ul class="clearfix">
    <li class="current"><a href="#section-1">Section 1</a></li>
<li><a href="#section-2">Section 2</a></li>
<li><a href="#section-3">Section 3</a></li>
<li><a href="#section-4">Section 4</a></li>
<li><a href="#section-5">Section 5</a></li>
    </ul>
    <a href="#" id="pull">Menu</a>
</nav>

这是我正在使用的脚本。

代码语言:javascript
运行
复制
    $(function() {
        var pull        = $('#pull');
            menu        = $('nav ul');
            menuHeight  = menu.height();

        $(pull).on('click', function(e) {
            e.preventDefault();
            menu.slideToggle();
        });

        $(window).resize(function(){
            var w = $(window).width();
            if(w > 320 && menu.is(':hidden')) {
                menu.removeAttr('style');
            }
        });
    });

响应式导航工作正常,只是无法在点击链接后关闭。我必须单击菜单按钮才能将其关闭。

EN

回答 1

Stack Overflow用户

发布于 2013-10-28 00:32:47

代码语言:javascript
运行
复制
$('#nav ul li a').on('click',function(){
    $(this).parent().parent().slideToggle(); 
});

这应该行得通。

使用.parent(),您可以在hyrachie中向上一步,所以使用它两次可以从菜单本身的链接中获取。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/19620384

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档