如何通过javascript拖放避免闪烁效果答案

【问题标题】：How to avoid flickering effect with javascript drag and drop如何通过javascript拖放避免闪烁效果
【发布时间】：2009-03-19 19:24:21
【问题描述】：

我使用以下 javascript（带有 jQuery）来处理我正在编写的脚本上的拖放：

jsc.ui.dragging = false;
jsc.ui.drag_element = {};
$(".drag-target").mousedown(function() {
    jsc.ui.drag_element =  $(this);
    jsc.ui.dragging = true;
});
$("html").mousemove(function(e) {
    if(jsc.ui.dragging) {
        jsc.ui.drag_element.css({"position": "absolute", "top": e.clientY - 1, "left": e.clientX - 1, "z-index": "100"}); // - 1s are due to IE not leaving go otherwise
        $("#overlay").show(); // Overlay stops text beneath being selected. TODO Stop current elements text being selected.
    }
});
$(".drag-target").mouseup(function() {
    if(jsc.ui.dragging) {
        jsc.ui.dragging = false;
        jsc.ui.drag_element.css("z-index", "98");
        $("#overlay").hide();
    }
});

但是，当对象被拖动时，其中的文本会出现闪烁的选择，即在移动元素时打开和关闭它。有什么办法可以防止这种情况发生，或者隐藏它的影响吗？

【问题讨论】：

标签： javascript jquery drag-and-drop

【解决方案1】：

是否有不使用 jQuery UI Draggable 的理由？您的代码将如下所示：

$(".drag-target").draggable();

你至少应该检查一下它是如何构建的，它可以帮助你解决闪烁问题。

【讨论】：

jQuery UI 是模块化的吗？如果是，原因是对 jQuery UI 缺乏认识。但是，我目前没有使用 jQuery UI，因此为一个部分添加额外的框架似乎有点过头了，如果我需要使用整个框架，原因是性能问题。
完全模块化，你可以在这里选择你需要的东西：jqueryui.com/download。 jquery.ui.core 和可拖动的 27k，在我看来并没有那么大......试一试，然后决定是保留它还是尝试解决这个闪烁的问题；）

【解决方案2】：

我认为效果的程度取决于您的硬件和视频驱动程序。为了完全避免这种情况，您可以只绘制一个矩形，然后在释放鼠标按钮时重新绘制窗口。

【讨论】：