話不多說,往左側滑動,顯示刪除,我們先來看一下效果圖:如下:
這個布局我就不多說,反正就是一行ul,li,
class名“item”
js代碼如下:
$(".item").on("swipeleft",function(){
$(this).addClass('selected').parents(".touch").siblings().find(".item").removeClass('selected');
$(this).find("a.remove").on("click",function(){
var touchId = $(this).parents(".touch").attr("id");
//執行刪除效果
$("#"+touchId).css("border","0");
$("#"+touchId).stop().animate({
height:"0",
margin:"0"
},300,function(){
$(this).remove();
})
})
}).on("swiperight",function(){
$(this).parents(".touch").find(".item").removeClass('selected');
})
其中要增加一下zepto.min.js調用,就能達到app左側滑動刪除效果左.
其用有更好的優化代碼,請留言,一同學習