jquery实现拖动

来源:互联网 发布:淘宝面膜便宜的原因 编辑:程序博客网 时间:2024/06/05 20:05
<!DOCTYPE html><html><head><style>div{ width:100px; height:100px; background:red; position:absolute;}</style><script type="text/javascript" src="js/jquery-1.11.3.js"></script><script>$(function(){var disX = 0;var disY = 0;$('div').mousedown(function(ev){disX = ev.pageX - $(this).offset().left;//获取鼠标到元素的left,top位置disY = ev.pageY - $(this).offset().top;$(document).mousemove(function(ev){$('div').css('left',ev.pageX - disX);//获取移动后鼠标的位置,并重新赋值给元素$('div').css('top',ev.pageY - disY);});$(document).mouseup(function(){$(document).off();});return false;});});</script></head><body><div></div></body></html>

原创粉丝点击