1

在移动设备上查看时，我正在使用 Sidr 插件向我的网站添加侧边菜单。当用户单击其中一个侧面菜单项时，我希望菜单关闭，然后向下动画到他们选择的项目。本质上，它是一个美化的内部链接菜单，其中包含大量指向带有 ID 的内容的哈希链接。

以下是我目前为此目的的代码：

    $(".mobile-nav button").sidr({source: ".sidr" });
    $('.sidr nav ul').on('click', 'li a[href^="#"]', function(){
        $(".mobile-nav button").click();
        var target = this.hash;
        var $target = $(target);

        $('html, body').stop().animate({
            'scrollTop': $target.offset().top
        }, 900, 'swing', function () {
            window.location.hash = target;
        });

        return false;
    });

在桌面浏览器上以 400px 宽查看时效果很好。但是当在实际的手机上查看时，有效关闭 Sidr 菜单的 .click() 不起作用。

我相信这是因为您无法“点击”手机，但谁能想到我该如何解决这个问题？任何帮助都会很棒。

谢谢

4

2 回答 2

0

使用click touchstart：

$('.sidr nav ul').on('click touchstart', 'li a[href^="#"]', function(){
//rest of your code
}
于 2015-02-27T05:01:09.160 回答
0

我在移动设备上遇到了与 sidr 类似的问题。最后，我用

$.sidr("toggle","sidr-0");

而不是

$( "#sidr-0" ).trigger( "click" );

它奏效了。这显然与移动设备上的文档就绪和移动浏览器使用 ajax 页面加载导致 click() 被提前触发有关。我希望这有帮助。

于 2015-12-07T20:00:29.880 回答