123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103 |
- <!doctype html>
- <html>
- <head>
- <meta charset="utf-8">
- <title></title>
- <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
- <link rel="stylesheet" href="../css/weui.css"/>
- <link rel="stylesheet" href="../css/weuix.css"/>
- <script src="../js/zepto.min.js"></script>
- <script src="../js/zepto.weui.js"></script>
- </head>
- <body ontouchstart>
- <div class="container">
- <div class="page-hd">
- <h1 class="page-hd-title">
- 滑动删除
- </h1>
- <p class="page-hd-desc">Swipeout</p>
- </div>
- <div class="page-bd-15">
- <div class="weui-cells">
- <div class="weui-cell weui-cell_swiped" id="s1">
- <div class="weui-cell__bd">
- <div class="weui-cell">
- <div class="weui-cell__bd">
- <p>左滑列表</p>
- </div>
- <div class="weui-cell__ft">向左滑动试试</div>
- </div>
- </div>
- <div class="weui-cell__ft">
- <a class="weui-swiped-btn weui-swiped-btn_warn delete-swipeout" href="javascript:">删除</a>
- <a class="weui-swiped-btn weui-swiped-btn_default close-swipeout" href="javascript:">关闭</a>
- </div>
- </div>
- <div class="weui-cell weui-cell_swiped" id="s2">
- <div class="weui-cell__bd">
- <div class="weui-cell">
- <div class="weui-cell__bd">
- <p>左滑列表</p>
- </div>
- <div class="weui-cell__ft">向左滑动试试</div>
- </div>
- </div>
- <div class="weui-cell__ft">
- <a class="weui-swiped-btn weui-swiped-btn_warn delete-swipeout" href="javascript:">删除</a>
- </div>
- </div>
- <div class="weui-cell weui-cell_swiped" id="s3">
- <div class="weui-cell__bd">
- <div class="weui-cell">
- <div class="weui-cell__hd"><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC4AAAAuCAMAAABgZ9sFAAAAVFBMVEXx8fHMzMzr6+vn5+fv7+/t7e3d3d2+vr7W1tbHx8eysrKdnZ3p6enk5OTR0dG7u7u3t7ejo6PY2Njh4eHf39/T09PExMSvr6+goKCqqqqnp6e4uLgcLY/OAAAAnklEQVRIx+3RSRLDIAxE0QYhAbGZPNu5/z0zrXHiqiz5W72FqhqtVuuXAl3iOV7iPV/iSsAqZa9BS7YOmMXnNNX4TWGxRMn3R6SxRNgy0bzXOW8EBO8SAClsPdB3psqlvG+Lw7ONXg/pTld52BjgSSkA3PV2OOemjIDcZQWgVvONw60q7sIpR38EnHPSMDQ4MjDjLPozhAkGrVbr/z0ANjAF4AcbXmYAAAAASUVORK5CYII=" alt="" style="width:20px;margin-right:5px;display:block"></div>
- <div class="weui-cell__bd">
- <p>左滑列表</p>
- </div>
- <div class="weui-cell__ft">向左滑动试试</div>
- </div>
- </div>
- <div class="weui-cell__ft">
- <a class="weui-swiped-btn weui-swiped-btn_default close-swipeout" href="javascript:">取消关注</a>
- </div>
- </div>
- </div>
- </div>
- <br>
- <br>
- <div class="weui-footer weui-footer_fixed-bottom">
- <p class="weui-footer__links">
- <a href="../index.html" class="weui-footer__link">WeUI首页</a>
- </p>
- <p class="weui-footer__text">Copyright © Yoby</p>
- </div>
- </div>
- <script>
- /* js加载进来用
- $('.weui-cell_swiped').swipeout()
- 初始化
- $('.weui-cell_swiped').swipeout('close') 关闭
- */
-
- $('.delete-swipeout').click(function () {
- $(this).parents('.weui-cell').remove()
- })
- $('.close-swipeout').click(function () {
- $(this).parents('.weui-cell').swipeout('close')
- })
- $('.weui-cell_swiped').swipeout('open')
-
- </script>
- </body>
- </html>
|