Question

高分！！用js在div里创建了一个iframe，实现拖拽，用鼠标拖拽时很卡而且向下拖拽有问题，这是什么回事？

td.onmousedown = function () {//鼠标按下
this.style.cursor = "move"; //设置鼠标样式
var d = document;
a = window.event; //按下时创建一个事件
var x = a.clientX - document.body.scrollLeft - objWin.offsetLeft; //x=鼠标相对于网页的x坐标-网页被卷去的宽-待移动对象的左外边距
var y = a.clientY - document.body.scrollTop - objWin.offsetTop; //y=鼠标相对于网页的y左边-网页被卷去的高-待移动对象的左上边距
d.onmousemove = function () {//鼠标移动
a = window.event; //移动时创建一个事件
objWin.style.left = a.clientX + document.body.scrollLeft - x;
objWin.style.top = a.clientY + document.body.scrollTop - y;
};
d.onmouseup = function () {//鼠标放开
td.style.cursor = "normal"; //设置放开的样式
document.onmousemove = null;
document.onmouseup = null;
};
};
这是这是实现拖拽的代码

Answer 1

没搞懂你objWin是什么意思，全部改成td后才能成功移动，感觉并不卡。
<div id="td"></div>
<script>
td.onmousedown = function () {//鼠标按下
this.style.cursor = "move"; //设置鼠标样式
var d = document;
a = window.event; //按下时创建一个事件
var x = a.clientX - document.body.scrollLeft - td.offsetLeft; //x=鼠标相对于网页的x坐标-网页被卷去的宽-待移动对象的左外边距
var y = a.clientY - document.body.scrollTop - td.offsetTop; //y=鼠标相对于网页的y左边-网页被卷去的高-待移动对象的左上边距
d.onmousemove = function () {//鼠标移动
a = window.event; //移动时创建一个事件
td.style.left = a.clientX + document.body.scrollLeft - x;
td.style.top = a.clientY + document.body.scrollTop - y;
};
d.onmouseup = function () {//鼠标放开
td.style.cursor = "normal"; //设置放开的样式
document.onmousemove = null;
document.onmouseup = null;
};
};
</script>

追问

objWin 是最外的一个层。td是它里面的一个层，就是先选择td。。然后拖拽整个objWin层移动

追答

这是我做的，只是没有iframe，JS直接用的你的，没感觉任何问题，我用的是IE8

无标题文档

td.onmousedown = function () {//鼠标按下
this.style.cursor = "move"; //设置鼠标样式
var d = document;
a = window.event; //按下时创建一个事件
var x = a.clientX - document.body.scrollLeft - objWin.offsetLeft; //x=鼠标相对于网页的x坐标-网页被卷去的宽-待移动对象的左外边距
var y = a.clientY - document.body.scrollTop - objWin.offsetTop; //y=鼠标相对于网页的y左边-网页被卷去的高-待移动对象的左上边距
d.onmousemove = function () {//鼠标移动
a = window.event; //移动时创建一个事件
objWin.style.left = a.clientX + document.body.scrollLeft - x;
objWin.style.top = a.clientY + document.body.scrollTop - y;
};
d.onmouseup = function () {//鼠标放开
td.style.cursor = "normal"; //设置放开的样式
document.onmousemove = null;
document.onmouseup = null;
};
};

追问

只有div的话是正常的。加了iframe。就有问题了。不能向下拖拽

追答

可以拖拽，只是如果你的td层如果高度较小的，拖快了会有点问题，这属正常情况。

Answer 2

artDialog 这个插件很好用，可以试试