【前端开发实例】移动端购物车左滑删除 -（七）

最新推荐文章于 2022-08-24 21:46:14 发布

一点编程

最新推荐文章于 2022-08-24 21:46:14 发布

阅读量2.9k

点赞数

分类专栏：开发实践前端文章标签： html 前端开发左滑删除

本文链接：https://blog.csdn.net/JasonAPoint/article/details/78820970

版权

Question. 问题

实现一个购物车中，左滑商品出现删除按钮的效果。

Solution. 解决

HTML文档部分：

<ul class="cart-buy list" id="list">
    <li class="cart-tr it-selected" id="150" data-spec="" style="border-bottom: none;">
        <div class="checkbox mui-checkbox">
            <input type="checkbox" name="checkbox1" id="listCheckBox" value="1" checked="checked">
        </div>
        <div class="nr">
            <a href="http://www.58dmnk.com/H4WXw-g.html" class="picbox"><img src="upload/img/goods/20171216/96880305e72bbd2bb3325a90a538b603_s.jpg" width="60" height="60" alt="商品图片未上传"></a>
            <div class="word">
                <a href="http://www.58dmnk.com/H4WXw-g.html" class="title">德玛乃康木兰醇四合一祛痘套装</a>
                <div class="price">
                    <p class="left red">￥<span class="g-price">199.00</span></p>
                    <p>x<span class="reconum">1</span></p>
                </div>
            </div>
            <