Mousedown 事件与 ipad/iphone 的兼容性？ - jQuery 移动

发布于 2024-10-07 21:05:42 字数 643 浏览 3 评论 0原文

我用jquery写了一个小滚动条。滚动条似乎在 PC 和 Mac 上都能完美运行。但它不适用于触摸设备。

我猜这是由于 mousedown 属性被调用所致。如何在 PC 和触摸屏设备上实现此功能？

谢谢

$('.scroll-nav-up, .scroll-nav-down').live('click', function(){
    $('.scroller-wrap').stop();
    return false;
});


$('.scroll-nav-up').live('mousedown', function(){

    $(this).closest('.item').find('.scroller-wrap').animate({
        top: -($(this).closest('.item').find('.scroller-wrap').height() - 250)
    }, 800);

});


$('.scroll-nav-down').live('mousedown', function(){

    $(this).closest('.item').find('.scroller-wrap').animate({
        top: 0
    }, 800);

});

原文

I wrote a small scroller in jquery. The scroller seems to work perfectly on PC and Macs. However it doesn't work on touch devices.

I guess this is due to mousedown property being called. how do I make this work on both PC and touch screen devices?

Thanks

$('.scroll-nav-up, .scroll-nav-down').live('click', function(){
    $('.scroller-wrap').stop();
    return false;
});


$('.scroll-nav-up').live('mousedown', function(){

    $(this).closest('.item').find('.scroller-wrap').animate({
        top: -($(this).closest('.item').find('.scroller-wrap').height() - 250)
    }, 800);

});


$('.scroll-nav-down').live('mousedown', function(){

    $(this).closest('.item').find('.scroller-wrap').animate({
        top: 0
    }, 800);

});

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

陌伤浅笑 2024-10-14 21:05:42

如果您使用的是 jquery mobile，请尝试处理其新事件 tap 和 taphold

http://jquerymobile.com/demos/1.0a2/#docs/api/events.html

我无法测试它，所以这只是一个想法（我不确定我是否理解您的应用程序的作用），但您可以尝试将 click 更改为 mouseup 事件。

回复收藏 0 原文

胡渣熟男 2024-10-14 21:05:42

没有发现什么特别的，所以目前我正在使用 2 个脚本。第一个脚本识别触摸屏设备，由 Alastair Campbell 在 Detecting touch-基于浏览。

function isTouchDevice() {
   var el = document.createElement('div');
   el.setAttribute('ongesturestart', 'return;');
   if(typeof el.ongesturestart == "function"){
      return true;
   }else {
      return false
   }
}

然后对于常规浏览器使用 mousedown 事件，对于触摸屏设备使用 tap 事件。

PS - 同时使用 jQuery 和 jQuery Mobile

Nothing special found, so at this moment I am using 2 scripts. The first script identifies the the touch screen devices as written by Alastair Campbell on Detecting touch-based browsing.

function isTouchDevice() {
   var el = document.createElement('div');
   el.setAttribute('ongesturestart', 'return;');
   if(typeof el.ongesturestart == "function"){
      return true;
   }else {
      return false
   }
}

and then use the mousedown event for regular browsers and use tap event for touch screen devices.

P.S - Using both jQuery and jQuery Mobile

回复收藏 0 原文

~没有更多了~