您的位置：首页 > 其它

hammer滑动删除

2016-02-23 09:54 239 查看

使用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

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航