4

我有一个可拖动的如下：

<div id="_splitter" style="width: 40px; height: 40px; position: relative; z-index: 1; margin: -20px -23px auto auto; border: 3px solid gray; opaciy:.5;"></div>

在 Chrome 中，它仅在第一个 mouseup 事件之前才能正常工作。一旦 div 被拖动到一个新位置，下一次拖动会将元素移动到左上角的边距大小，所以当你第二次开始拖动它时，它看起来就像一个突然的跳跃。

该问题仅出现在 Chrome、FF 和 Opera 工作正常。谁能建议我如何让它在 Chrome 中工作？

注意：我想找到一个修复程序，而不是破解，我知道如果我删除/重新添加可拖动它可能会起作用，但这不是我所追求的。

这是一个重现的 HTML，抱歉没有小提琴：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>draggable</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js" type="text/javascript"></script> 
    <script type="text/javascript">
        $(document).ready(function () {

            $("#_splitter").draggable();
        });
    </script>
</head>
<body>
    <div>
        <div id="_splitter" 
            style="width: 40px; height: 40px; position: relative; z-index: 1; margin: 100px auto auto 100px; border: 3px solid gray; background-color: Green;"></div>
    </div>
</body>
</html>
4

1 回答 1

0

这个对我有用。我只是在 JSFiddle 中重新组织它，只是剪切和粘贴。

在这里查看JSFiddle

于 2012-09-15T05:29:20.060 回答