我在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); });
解决方法
快速检查触摸可能吗?
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 ); },function(){ this.iid && clearInterval(this.iid); }); }
无论如何都是这样的.