拖拽效果的jQuery实现

由于框架实现了拖动，找到了一半的原因并没有发现错误，所以，只看源代码。
如何实现拖动效果

首先分析了低阻力效应的原理。

1。当鼠标按下鼠标拖动对象（触发onmousedown事件，和鼠标上面的对象）

2。开始移动鼠标（鼠标移动时触发的事件）

三.当移动时，更明确的对象的顶部和左边值。

4。鼠标拖动（触发onmouseup事件发布停止）

注意：拖动的对象必须是本地化对象（即，设置位置：绝对位置或相对位置）。
也就是说，拖动事件= onmousedown事件+移动鼠标事件
整个过程是处理这三个事件来模拟拖动事件。

现在看一下我实现的源代码。
HTML代码：
标题（单击标题拖动）
标题
点击我移动
jQuery插件代码：

（函数（$）{）
函数=（选项）{

默认配置
var默认值= {
汉德勒：假，
不透明度：0.5
}；

默认配置/覆盖
VaR选择=美元。扩展（默认值，选择）；

this.each（函数（）{（）

/初始标记变量
无功ismove = false，
如果处理程序没有设置任何值，则默认为移动对象本身，否则设置处理程序值集。
处理程序=选择。处理程序（这）美元。找到（选择。Handler）：$（this），
_this = $（this）， / /移动对象
DX；

$（文件）
移动鼠标来改变对象的位置。
。MouseMove（功能（事件）{）
/ / console.log（ismove）；
如果（ismove）{

获取鼠标位置后
var前= event.pagex，EY = event.pagey；

更新对象坐标
_this.css（{右：前DX，' '：EY dy }）；

}
}）

当您释放鼠标拖动/停止时。
。松开鼠标（功能（）{（）
ismove = false；
_this.fadeto（'fast '，1）；
/ / console.log（ismove）；
}）；

处理程序
/ /当你按下鼠标ismousedown真，设置标记变量
。MouseDown（功能（事件）{）

如果对象是处理程序，则执行最后的判决触发事件。
如果（$（事件对象））是（处理程序））{

ismove =真；
$（这）。Css（'cursor '，'move）；

/ / console.log（ismove）；
_this.fadeto（'fast '，选择。透明度）；

移动对象的鼠标坐标
DX = event.pagex-parseint（_this.css（左））；
DY = event.pagey-parseint（_this.css（顶））；

}
}）；
}）；
}；
}（jQuery）；

调用方法：
$（函数（）{（））

拖动标题
$（）拖动。
汉德勒：$（title），对象操作拖动，这个对象必须是移动对象元素。
不透明：当拖动透明度时设置为0.7
}）；

主题拖动
$（。drag1）。拖动（{
不透明度：0.7
}）；

}）；
以上是本文的全部内容，希望能对您有所帮助，希望大家多多支持。