欢迎各位兄弟 发布技术文章
这里的技术是共享的
原生的jQuery并没有对移动Web做很好的支持,比如滑动事件。在使用下拉刷新、轮播图移动等操作时,都需要用到滑动事件,这里推荐一个jQuery插件TouchSwipe-Jquery-Plugin。
Github地址: https://github.com/mattbryson/TouchSwipe-Jquery-Plugin
Github及官方文档上已经做了详细的介绍,这里简单的说一下滑动操作的基本功能。
$(function() { //Enable swiping... $("#test").swipe( { //Generic swipe handler for all directions swipe:function(event, direction, distance, duration, fingerCount, fingerData) { $(this).text("You swiped " + direction ); }, //Default is 75px, set to 0 for demo so any distance triggers swipe threshold:0 }); });
引入了jQuery库和TouchSwipe后,可以使用上面的代码检测到滑动事件,其中的direction指方向,有'up', 'down', 'left', 'right' 而distance指滑动距离。下面的threshold指的是触发范围,既最小滑动多少才触发,注意,实际使用时,一般不能为0,因为设置为0将覆盖click, tap等点击操作。如果要检测整个页面的滑动,可以把#test改为body。
这个例子的演示页面: http://labs.rampinteractive.co.uk/touchSwipe/demos/Basic_swipe.html
来自 http://www.tuicool.com/articles/yq6nUv