用JQuery写拖拽的简单实例

来源：互联网发布：淘宝无响应是怎么回事编辑：程序博客网时间：2024/05/21 21:02

<!DOCTYPE html><html><head lang="en">    <meta charset="UTF-8">    <title></title></head><style>    #dv1 {        background: red;        width: 100px;        height: 100px;        position: absolute;    }</style><body><div id="dv1"></div></body><script src="jquery-1.11.3.min.js"></script><!--<script type="text/javascript" src="jquery-1.10.1.min.js"></script>--><script>    $(function () {        var disX = 0;        var disY = 0;        alert(1);        $('#dv1').mousedown(function(ev) {            disX = ev.clientX - $(this).offset().left;            disY = ev.clientY - $(this).offset().top;            $(document).mousemove(function(ev) {                $('#dv1').css('left', ev.pageX - disX);                $('#dv1').css('top', ev.pageY - disY);            });            $(document).mouseup(function() {                $(document).off();            });            return false;        })    })</script></html>

0 0