防止jQuery在触摸设备上运行mouseenter事件

Question

防止jQuery在触摸设备上运行mouseenter事件

8

我用jQuery写了一些不错的鼠标悬停滚动效果，在桌面电脑上运行良好。但是，我的问题在于在移动设备上，用户通过点击屏幕来操作，导致我的代码仍然认为用户正在悬停在我的.scrollright div上并继续滚动。

我该如何在移动/平板设备上禁用它，或者以其他方式解决这个问题？

$('.thumbnails .scrollright').on('mouseenter', function() {
    this.iid = setInterval(function() {
        var CurrentScrollLeft = $( ".thumbnails .thumbnailphotos" ).scrollLeft();
        $( ".thumbnails .thumbnailphotos" ).scrollLeft( CurrentScrollLeft+10 );         
    }, 50);
    }).on('mouseleave', function(){
        this.iid && clearInterval(this.iid);
    });

- Chris DeMarco

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- chrismauck · Accepted Answer

也许是为了快速检查触摸?

var tap = ("ontouchstart" in document.documentElement);

然后将您的代码放入条件语句中：

if(!tap){
    $('.thumbnails .scrollright').on('mouseenter', function() {
        this.iid = setInterval(function() {
            var CurrentScrollLeft = $( ".thumbnails .thumbnailphotos" ).scrollLeft();
            $( ".thumbnails .thumbnailphotos" ).scrollLeft( CurrentScrollLeft+10 );         
        }, 50);
    }).on('mouseleave', function(){
        this.iid && clearInterval(this.iid);
    });
}

无论如何都是这样。