移动html5 滑动 zepto,移动端使用zepto编写的滑动事件

移动端触摸滑动,自己写的，如果有什么不对的，希望指教

1.[文件] swipe.zip ~ 16KB     下载(363)

2.[文件] index.html ~ 2KB     下载(156)

Document

*{margin: 0;padding: 0;}

.wrapper{width:100%;height: 200px;overflow: hidden;position: relative;}

.content{height:200px;}

.content>div{

float: left;

height: 200px;

}

.btn{position: absolute;bottom: 20px;width: 80%;text-align: center;}

.btn a{width: 10px;height: 10px;border-radius: 100%;display: inline-block;border: 1px solid #fff;margin:0 3px;}

.btn .active{background: #fff;}

$(function(){

var blt = (function () {

return new swipers();

})();

function swipers(){};

swipers.prototype.slider=function(tagName,propo){

document.addEventListener('touchmove', function (event) {

event.preventDefault();

}, false);

var parent = tagName.parent();

var _len = tagName.length;

for (var i = 0; i < _len; i++) {

$("").appendTo(parent.next());

};

$("a").eq(0).addClass("active");

var imgLen = (1/_len)*100;

tagName.css("width",imgLen + "%");

parent.css("width",_len * 100+"%");

tagName.swipeLeft(function(){

blt.swipe(this,1,_len-1,propo);

})

tagName.swipeRight(function(){

blt.swipe(this,-1,0,propo);

});

}

swipers.prototype.swipe=function(key,value,length,propo){

var _len = propo.length;

var index = $(key).index();

var imgLen = (1/_len)*100;

var len = -imgLen * (index+value) + "%";

if (index == length) {

return false;

}else{

$(key).parent().css({

'-webkit-transform':'translate('+len+')',

'-moz-transform':'translate('+len+')',

'transform':'translate('+len+')',

'-webkit-transition':'500ms linear',

'-moz-transition':'500ms linear',

'transition':'500ms linear'

});

$("a").eq(index + value).addClass("active")

.siblings().removeClass('active');

}

return this;

}

var _img = $(".content>div");

blt.slider(_img,$(".content>div"));

})