鼠标拖动div的插件,js鼠标拖动div

鼠标Press-2div并随其移动。这鼠标-2divJS是什么原理？并监控鼠标的动作，当鼠标移动时，半透明的div也随着鼠标移动，然后当你鼠标左键点击时，会弹出半透明的DIV。

$(function(){$(#rr1，#rr2，#rr3 )。liger drag()；$(#rr1，#rr2，#rr3 )。ligerrestablished()；});

这个可以用js实现。我可以先给你一个思路，用div的onmousemove事件来判断鼠标relativediv的位置是否是一个边缘(这个值得你自己设置)来改变-。可以更改鼠标shape changediv的顶部和左侧属性，可以动态更改div的位置，即拖放。

(function($){/drag插件，参数:id或object $。move function(_ this){ if(type of(_ this) object ){ _ this _ this；} else { _ this $(# _ this)；}如果(！_ this){ return false；} _ this . CSS({ position: absolute })。hover(function(){$(this)。css(光标，

function(){$(this)。css(光标，默认)；})_ this . mousedown(function(e){//e鼠标event var offset $(this)。offset()；varxe . pagexoffset . left；varye . pageyoffset . top；_ this . CSS({ opacity : 0.3 })；$(文档)。绑定(鼠标移动，

你的代码有几个问题:ttrue$(找到#个)。单击(function(){$(body))。追加(按住我移动)//这里this代表#found元素，//所以要改成$ (#run) $ (this)。mouseup(function(){//只要鼠标释放一次，# run就不能再是-。

tfalse}) $ (#run)。mousedown(function(e){//每次在# run上按下鼠标都会增加一个鼠标 move事件！$(这个)。mousemove(function(e){ if(t){ $(# aa)。html (e.pagex ， e . pagey)//下面这句话应该改成X和Y减5 $(这个)。CSS ({left: e.pagex 5 px，

作为一个前端人，我必须告诉你，很多前端效果都是被表象忽悠的。要达到想要的效果，需要造假:①为拖动(右、下、右下角)做三个标签，默认为空白。根据原始DIV定义大小和位置，绝对定位。悬停会上去鼠标并更改，点击鼠标。②改变原div的大小，并在拖动过程中实时修改相关拖动标签的大小和位置。③拖拽可以使用jQueryUI的核心库。

的原理是当鼠标被按下时，会显示半透明的DIV，同时会监测到鼠标的运动。当鼠标移动时，半透明的div也会跟着移动。然后当你鼠标左键弹出时，半透明的DIV会为他隐藏，“自动刷新提示”的DIV会移动到你鼠标左键弹出的位置。

Target: div可以在页面中与鼠标一起移动。如果事件被绑定到盒子上，那么只有鼠标向下向右移动时才会在盒子的范围内，事件响应才能完成。然而，如果你想向左和向上移动，你不能。因为使用了clientX，所以用来获取鼠标在当前可见窗口中的坐标，div的偏移量是相对于整个页面的。因此，如果此时增加正文的高度或宽度，div将与鼠标分离，因为页面滚动时(0，0)的位置不同。

Document functiongetPos(e){//这是一个函数varoEvente | |事件，获取鼠标；return { x:oevent . clientx document . document element . scroll left | | document . body . sc 。