javascript代码实例教程-简洁易行的JS拖拽代码

发布时间:2019-01-19 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-简洁易行的JS拖拽代码脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
小宝典致力于为广大程序猿(媛)提供高品质的代码服务,请大家多多光顾小站,小宝典在此谢过。 VAR x, y
var Drag_ = false
var D = new Function('obj', 'return document.getElementById(obj);')
var IE = new Function(
'',
'if(navigator.appName.indexOf("Explorer")>=0)return 1;if(navigator.appName.indexOf("NetscaPE")>=0)return 2')
function Move_obj(obj) {// 1
D(obj).onmousedown = function(e) {
drag_ = true// 4
wITh (this) {
style.position = "absolute";
temp1 = offsetLeft;
temp2 = offsetTop;// 5
if (IE() == 1) {
x = event.clientX;
y = event.clientY// 6
document.onmouSEMove = function(e) {// 7
if (drag_ == false)
return false
with (this) {
style.left = temp1 + event.clientX - x + "px";
style.top = temp2 + event.clientY - y + "px"
}
}// 7
}// 6
if (IE() == 2) {
x = e.pageX;
y = e.pageY;// 8
document.onmousemove = function(e) {// 9
if (drag_ == false)
return false
with (this) {
style.left = temp1 + e.pageX - x + "px";
style.top = temp2 + e.pageY - y + "px"
}
}// 9
}// 8
}// 5
document.onmouseup = new Function("drag_=false")
}// 4
}// 1

-------------------------------------------------------------------------------以上是JS代码

使用很简单

在页面中引入JS

 

seover="Move_obj("add")">拉拽控件


 

觉得可用,就经常来吧! 脚本宝典 欢迎评论哦! js脚本,巧夺天工,精雕玉琢。小宝典献丑了!

脚本宝典总结

以上是脚本宝典为你收集整理的javascript代码实例教程-简洁易行的JS拖拽代码全部内容,希望文章能够帮你解决javascript代码实例教程-简洁易行的JS拖拽代码所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。