您的位置:首页 > Web前端 > JavaScript

swiperLeft/swiperRight以及js长按事件

2016-04-21 13:34 645 查看
在线实例:http://tkdj1811.cn/swipejs.html

<script src="../../style/js/jquery.min.js"></script>

<script src="../../style/expand/jquery.event.move.js"></script>

<script src="../../style/expand/jquery.event.swipe.js"></script>

<style type="text/css">

.list-container{min-height:0rem;overflow:hidden;margin-top:10rem;background:#fff;}

.list-container > li{background: #ffffff;margin-bottom:2px;display:block;overflow: hidden;height:9rem;line-height:9rem;border-top: 0.2rem solid #d8d8d8;font-size:3rem;}

.list-container> li a{position: relative;height:9rem;display: inline-block;width: 100%;float: left;}

.logText{text-indent:3rem;width:70%;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}

.logTime{padding-right:3rem;display:inline-block;float:right;}

.list-container li > span{display:inline-block;width:150px;background:red;height:9rem;text-align:center;line-height:9rem;}

</style>

</head>

<body>

<ul class="list-container">

  <li id="2007">

   <a href="#"><span class="logText">哈哈是啊撒是打发啊发撒地方阿斯顿发生的发撒地方阿斯顿发生的发撒地方暗示法打速度发V阿斯顿发撒话</span><span class="logTime">2014-6-12</span></a>

  <span class="logDel" onclick="del(this)">删除</span>

 </li>

</ul>

</body>

</html>

<script>

function swiperLi(){

      var cont=$(".list-container li");

      cont.on('swipeleft', function(e) {$(this).find("a").css("margin-left",-150);});

      cont.on('swiperight', function(e){$(this).find("a").css("margin-left",0);});

}

swiperLi();

</script>


手机端js模拟长按事件(代码仿照jQuery)

代码编写:

代码使用:

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: