jquery 上下触屏滑动_朋友圈常见单页面触屏滑动上下翻屏功能jQuery实现

/**

* @Creator: Nelson Kuang/Fast Mover

* @showup 翻页插件；实现原理，用margin-top来控制页面容器位置来实现上下翻页

* @License:The MIT License (MIT)

* @调用方式

$("#container").showup({

startPage: 0,//开始页面

duration:1000//动画持续时间

})

* @Creator: Nelson Kuang/Fast Mover

* @wipe 触屏滑动绑定触发事件

* @License:The MIT License (MIT)

* @调用方式

$("#node").wipe({

upEvent: function(){},//划上事件

downEvent: function(){}，//划下事件

rightEvent:function(){},//划右事件

leftEvent:function(){},//划左事件

delay: 500　//事件延时多久执行

});*/$.fn.extend({

wipe:function(options) {var defaults = {//wipe的默认参数配置

leftEvent: '',

rightEvent:'',

upEvent:'',

downEvent:'',

delay:500};var options = $.extend({}, defaults, options);//传入参数与默认参数合并

var line = {//定义滑动线的起点与终点

startX: 0, startY: 0,

endX:0, endY: 0},

results= {//定义滑动，左，右，上，下，或者任意

up: false,

down:false,

left:false,

right:false,

any:function () { return results.up || results.down || results.left ||results.right; }

},<