使用jquery实现拖拽

最新推荐文章于 2021-09-15 15:26:13 发布

代码De搬运工

最新推荐文章于 2021-09-15 15:26:13 发布

阅读量120

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/m0_46577631/article/details/107065637

版权

<body>
    <div class="box">
    </div>
    <script src="../JQ/jquery(2)/jQurey/jQurey各版本/jquery-3.3.1.js"></script>
    <script>
        $(document).on("mousedown", "div", function (e) {
            const { offsetX: x1, offsetY: y1 } = e;
            $(document).on("mousemove", e => {
                const { pageX: x2, pageY: y2 } = e;
                $(this).css({
                    left: x2 - x1,
                    top: y2 - y1,
                });
            })
        });

        $(document).on("mouseup", function (e) {
            $(document).off("mousemove");
        })
    </script>
</body>

代码De搬运工

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
使用jquery实现拖拽

<body> <div class="box"> </div> <script src="../JQ/jquery(2)/jQurey/jQurey各版本/jquery-3.3.1.js"></script> <script> $(document).on("mousedown", "div", function (e) { const { offsetX: x1,
复制链接

扫一扫