javascript – 水平滑动手势和垂直页面滚动

前端之家收集整理的这篇文章主要介绍了javascript – 水平滑动手势和垂直页面滚动前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在建立一个移动网站,我有一个图像的幻灯片放映,允许水平滑动图像.我正在使用的javascript库是bxslider.但是,如果有人触摸幻灯片并想要向上/向下滚动页面,则幻灯片放映会阻止垂直滚动,因此必须触摸该网站的另一部分.

有人可以告诉我如何启用垂直滚动(即,不允许幻灯片阻止正常滚动?)

谢谢!

最佳答案
试试这个,将bxslider库中的onTouchMove fn更改为

  1. var onTouchMove = function (e) {
  2. if (slider.settings.mode != 'fade') {
  3. var orig = e.originalEvent;
  4. var value = 0;
  5. // if horizontal,drag along x axis
  6. if (slider.settings.mode == 'horizontal')
  7. {
  8. var hchange = orig.changedTouches[0].pageX - slider.touch.start.x;
  9. var vchange = orig.changedTouches[0].pageY - slider.touch.start.y;
  10. if(Math.abs(hchange)>20 && Math.abs(hchange)>Math.abs(vchange))
  11. {
  12. value = slider.touch.originalPos.left + hchange;
  13. setPositionProperty(value,'reset',0);
  14. e.preventDefault();
  15. }
  16. // if vertical,drag along y axis
  17. } else{
  18. e.preventDefault();
  19. var change = orig.changedTouches[0].pageY - slider.touch.start.y;
  20. value = slider.touch.originalPos.top + change;
  21. setPositionProperty(value,0);
  22. }
  23. }
  24. }

猜你在找的jQuery相关文章