手机端滑动删除效果
代码语言:html
所属分类:菜单导航
代码描述:手机端滑动删除效果,采用hammer.js和jquery实现
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>BFW NEW PAGE</title>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/jquery.17.js"></script>
<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/hammer.min.js"></script>
<script type="text/javascript">;
(function (win, doc) {
$.fn.slide2del = function (options) {
var opt = $.extend(true, {
offset: 0,
sItemClass: "session-box",
sDelBtnClass: "del-btn"
}, options);
if (opt.sItemClass.indexOf(".") >= 0) {
opt.sItemClass = opt.sItemClass.substring(1);
}
if (opt.sDelBtnClass.indexOf(".") >= 0) {
opt.sDelBtnClass = opt.sDelBtnClass.substring(1);
}
opt.offset = $('.'+opt.sDelBtnClass).width();
return $(this).each(function () {
var offset = opt.offset;
//鍒涘缓涓€涓柊鐨刪ammer瀵硅薄骞朵笖鍦ㄥ垵濮嬪寲鏃舵寚瀹氳澶勭悊鐨刣om鍏冪礌
var _this = $(this).get(0);
$(this).on('touchend', function (e) {
var target = $(e.target);
if (!target.hasClass(opt.sItemClass)) {
target = target.parents('.'+opt.sItemClass);
}
var isShow = $(this).attr("isShow");
if (isShow != "true") {
console.log(&quo.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0