javascript - 导航栏在移动设备上折叠,滚动时使用 chrome/safari

标签 javascript jquery html drop-down-menu responsive-design

我正在研究 responsive site使用我自己的 css 而不是 bootstrap。

在 iphone 上的 safari 和在 andriod 上的 chrome 上,导航有问题。

如果您在菜单中打开一个类别并尝试滚动菜单将关闭。

最佳答案

我在调试时注意到您的 $(window).resize 函数在用户滚动时被调用。如果宽度没有改变,您可以简单地忽略调整大小事件,它将解决您的问题。

$(window).resize(function(){

    if ( width == GetWidth() ) {
        return;
    }

    width = GetWidth();

    if(width >= 768){
        $("#logo").removeClass("front");
        $("#icon-bar .front").removeClass("front");
        $("#main-navi").show();
        $("#main-navi>li ul").hide();
        $("#main-navi .dropped").removeClass('dropped');
    } else {
        $("#main-navi").hide();
    }
});

如果您再遇到麻烦,请告诉我!

关于javascript - 导航栏在移动设备上折叠,滚动时使用 chrome/safari,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17711676/

相关文章:

javascript - AngularJS:指令未触发或工作

javascript - 如何在 node.js 中将数组作为参数传递给 jar exec

javascript - 使用千位分隔符格式的按键功能进行计算

html - 我怎样才能使这个媒体查询工作以垂直查看菜单?

html - Firefox 桌面和 Chrome 移动添加神秘的文本输入宽度填充

javascript - 如何在正则表达式构造函数中包含符号?

javascript - IE10 上的 WebSocket 给出安全错误

javascript - Jquery:如何在加载时禁用图像的点击功能?

jquery - 使用 jQuery.Deferred 避免嵌套 setTimeout 回调

html - 增加 <td> 的宽度