首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >jQuery:如果有其他情况,请单击移动菜单

问jQuery:如果有其他情况,请单击移动菜单
EN

Stack Overflow用户
提问于 2019-10-30 16:34:34
回答 1查看 107关注 0票数 0

目前我的汉堡菜单在可湿性粉剂中有问题。到目前为止,它是在加载时立即打开的。它应该只在被点击的时候打开。

HTML

代码语言:javascript
复制
<div id="et-top-navigation" data-height="66" data-fixed-height="55" style="padding-left: 180px;">
     <nav id="top-menu-nav"></nav>
     <div id="et_mobile_nav_menu">
    <div class="mobile_nav closed">
         <span class="mobile_menu_bar mobile_menu_bar_toggle">::before</span>
         <ul id="mobile_menu" class="et_mobile_menu">*all li is here**</ul>
        </div>
     </div>
</div>

还有我的jQuery

代码语言:javascript
复制
jQuery("span.mobile_menu_bar.mobile_menu_bar_toggle").click(function(){
    var $this = jQuery(this);
    if($this.data('clicked')){
        jQuery("ul#mobile_menu").css({"display": "flex", "flex-direction": "column"});
        jQuery("ul#mobile_menu > li").css("order", "2");
        jQuery("ul#mobile_menu > .early-access-1").css("order", "1");
        jQuery("ul#mobile_menu > .early-access-2").css("order", "1");
    } else {
        jQuery("#mobile_menu").css("display", "none");
        jQuery("#mobile_menu").css("important");
    }

});
EN

回答 1

Stack Overflow用户

发布于 2019-10-30 17:33:40

js

代码语言:javascript
复制
//disable menu with js
//use only if you keep opening on your own. but it's probably something else that is conflicting
jQuery("#mobile_menu").css("display", "none");
jQuery("#mobile_menu").css("important");

//correct code
jQuery("span.mobile_menu_bar.mobile_menu_bar_toggle").click(function(){
    var $this = jQuery(this);
    console.log($this.data('clicked'));
    if( typeof $this.data('clicked') === 'undefined' ){
        $this.data('clicked', true);
    }else{
        $this.removeData('clicked');
    }

    if($this.data('clicked')){
        jQuery("ul#mobile_menu").css({"display": "flex", "flex-direction": "column"});
        jQuery("ul#mobile_menu > li").css("order", "2");
        jQuery("ul#mobile_menu > .early-access-1").css("order", "1");
        jQuery("ul#mobile_menu > .early-access-2").css("order", "1");
    } else {
        jQuery("#mobile_menu").css("display", "none");
        jQuery("#mobile_menu").css("important");
    }

});

css默认值

代码语言:javascript
复制
#mobile_menu{
    display: none;
}
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/58621304

复制
相关文章

相似问题

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