1 Star 0 Fork 247

strongWei/weui2

forked from yoby/weui 
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
slideleft.js 2.90 KB
一键复制 编辑 原始数据 按行查看 历史
yoby 提交于 2017-11-11 08:30 . 更新4.1
window.slideleft = (function($) {
var listItem = $('.weui_cell_bd'),
listOpts = $('.slideleft');
var onthel = false, // 是否处于最左端
isScroll = false, // 列表是否滚动状态
initX = 0, // 初始X坐标
initY = 0, // 初始Y坐标
endX = 0, // 结束时X坐标
endY = 0, // 结束时Y坐标
moveX = 0, // listItem 移动的距离
expandLi = null; // 是否存在展开的list
var slideMaxWid = listOpts.width();
var handleSlide = (function() {
listItem.on('touchstart',function(e){
// 判断有无已经展开的li,如果有,是否是当前的li,如果不是,将展开的li收起
if( expandLi ){
if( expandLi.parent().index()!==$(this).parent().index() ){
// 判断当前list是左滑还是上下滑
if( Math.abs(endY-initY) < Math.abs(endX-initX) ){
e.preventDefault();
}
expandLi.css('-webkit-transform','translateX('+0+'px)');
}
}
initX = e.targetTouches[0].pageX;
initY = e.targetTouches[0].pageY;
moveX = $(this).offset().left;
$(this).on('touchmove',function(e){
var curY = e.targetTouches[0].pageY;
var curX = e.targetTouches[0].pageX;
var X = curX - initX; // 不断获取移动的距离
$(this).removeClass('animated');
if( Math.abs(endY-initY)<Math.abs(endX-initX) ){
e.preventDefault();
if( moveX==0 ){
if( X>0 ) {
$(this).css('-webkit-transform','translateX('+0+'px)');
}else if( X<0 ){
if( X<-slideMaxWid ) X=-slideMaxWid;
$(this).css('-webkit-transform','translateX('+X+'px)');
}
}
// 已经处于最左
else if( moveX < 0 ){
onthel = true;
if( X>0 ) { // 向右滑
if( X-slideMaxWid>0 ){
$(this).css('-webkit-transform','translateX('+0+'px)');
}else{
$(this).css('-webkit-transform','translateX('+(X-slideMaxWid)+'px)');
}
}else { // 左滑
$(this).addClass('animated');
$(this).css('-webkit-transform','translateX('+0+'px)');
}
}
}else{
isScroll = true;
}
})
})
listItem.on('touchend',function(e){
endX = e.changedTouches[0].pageX;
endY = e.changedTouches[0].pageY;
var X = endX - initX;
$(this).addClass('animated');
//Slide to right or the distance of slide to left less than 20;
if( X>-20||onthel||isScroll ){
$(this).css('-webkit-transform','translateX('+0+'px)');
onthel = false;
isScroll = false;
}else{
$(this).css('-webkit-transform','translateX('+(-slideMaxWid)+'px)');
expandLi = $(this);
}
})
})();
})(Zepto);
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化
JavaScript
1
https://gitee.com/ATZ2015/weui2.git
git@gitee.com:ATZ2015/weui2.git
ATZ2015
weui2
weui2
master

搜索帮助