javascript - 无需克隆即可拖放 div

标签 javascript html css

请帮忙。我认为这很简单,但我不知道该怎么做。

我已经成功创建了可拖动元素,并且它们按预期完美运行。我可以毫无错误地拖放它们。

问题是这样的:

当我拖动(还没有放下)一个盒子(它是一个 div)时,我的屏幕上有那个盒子的两个副本:一个是它原来位置的盒子,另一个是那个盒子随我的鼠标一起拖动。

我想实现的是:

我希望当我开始拖动时,原来的盒子就消失了。我唯一想出现在屏幕上的框是随鼠标一起拖动的框。

我使用 CodeIgniter 作为我的框架,然后使用 javascript 来实现我的拖放效果。我没有使用 jquery,因为我对它的了解非常有限。

谢谢。

最佳答案

为什么这个需要用clone,我不明白。我写了一个DEMO在 jsfiddle 上使用您可能需要的 native javascript。

ZxDrugProto._druging = function(e) {
    this.top = e.clientY - this.preY + this.top;
    this.left = e.clientX - this.preX + this.left;
    this.dom.style.top = this.top+'px';
    this.dom.style.left = this.left+'px';
    this.preY = e.clientY;
    this.preX = e.clientX;
}

关于javascript - 无需克隆即可拖放 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24689080/

相关文章:

javascript - 创建掉落字母和单词的技术

javascript - 从 10 开始倒计时,当计时器 react 到 0 时重复此操作

css - 从 Angular Material <mat-chip> 中移除 box-shadow

javascript - 在屏幕中间叠加位置和淡入淡出

javascript - 通过搜索最近的类(class)来更改类(class)

html - 如何删除间隙

javascript - JS/html游戏转Android应用程序而不使用webview

javascript - 多个模态的可见属性未定义

javascript - 使用javascript隐藏div

javascript - 带有 jquery 数组的 .grep() 只返回最后一位数字