hammer滑动删除

使用hammer.js实现移动端常见的滑动删除效果

需先引入hammer.js和jquery.hammer.js,以此使用jquery语法来调用hammer.js插件

例子:

<body>
<ul>
	<li>XXXXXX</li>
	<li>删除</li>
</ul>
</body>
<script src="js/jquery.min.js"></script>
<script src="js/hammer.min.js"></script>
<script src="js/jquery.hammer.js"></script>
<script>

//滑动删除
var ul = $('ul');
ul.hammer().bind('swipeleft',function(){
	$(this).addClass('active');		//使用transition过渡写滑动动画
})
ul.hammer().bind('swiperight',function(){
	$(this).removeClass('active');
})
//点击删除
$('ul li:nth-child(2)').on('click',function(){
	$(this).parent('ul').remove();
})

</script>
hammer.js官网: http://hammerjs.github.io/

中文文档:http://www.tuicool.com/articles/VNRjym7

你可能感兴趣的:(hammer滑动删除)