Javascript 可拖动<;部门>;不';在Firefox中发布后,不会恢复到原来的大小

Javascript 可拖动<;部门>;不';在Firefox中发布后,不会恢复到原来的大小,javascript,jquery,html,css,jquery-ui,Javascript,Jquery,Html,Css,Jquery Ui,拿着这个拖鞋。它在Chrome中释放(+鼠标移动)后会恢复到原来的大小,但在Firefox中不会这样做 <div id="container"> <div class="drag"></div> </div> $(".drag").draggable({ revert: true, containment: "#container" }); .drag:hover { width: 100px; height: 90p

拿着这个拖鞋。它在Chrome中释放(+鼠标移动)后会恢复到原来的大小,但在Firefox中不会这样做

<div id="container">
    <div class="drag"></div>
</div>


$(".drag").draggable({
    revert: true,
    containment: "#container"
});

.drag:hover {
width: 100px;
height: 90px;
margin-left: -5px;
margin-top: -7px;
line-height: 62px;
}

.drag {
    position: absolute;
    display: block;
    border: 1px solid black;
    width: 60px;
    height: 50px;
    float:left;
    margin: 5px;
    padding:0;
    padding-top: 5px;
    cursor: hand;
    cursor: pointer;
    border-radius: 51%;
    top: 40px;
    left: 100px;
    background-color: lightblue;
}

div#container {
    width: 100%;
    height: 700px;
    margin: 0;
    padding: 5px;
    position: relative;
}

$(“.drag”).draggable({
回复:对,
安全壳:“容器”
});
.拖动:悬停{
宽度:100px;
高度:90px;
左边距:-5px;
利润上限:-7px;
线高:62px;
}
.拖{
位置:绝对位置;
显示:块;
边框:1px纯黑;
宽度:60px;
高度:50px;
浮动:左;
保证金:5px;
填充:0;
垫面:5px;
光标:手;
光标:指针;
边界半径:51%;
顶部:40px;
左:100px;
背景颜色:浅蓝色;
}
分区#集装箱{
宽度:100%;
高度:700px;
保证金:0;
填充物:5px;
位置:相对位置;
}
为什么Firefox的行为是这样的,是否有任何可能的修复


与jQueryUI1.9.2配合使用。在Firefox上。这将使您能够更好地控制
draggable
行为。

$(".drag").draggable({
    addClasses: false,
    revert: function (valid) {
        if (valid) {
            //Dropped in a valid location
        } else {
            //Dropped in an invalid location
        }
        return valid;
    },
    containment: "#container"
});

Wokring fiddle:

你试过这个吗:在Firefox中,我得到了与Chrome相同的结果。如果我在释放鼠标后移动鼠标,大小会恢复正常:你使用的是什么版本的Firefox?我使用的是同一版本的
36.0.1
。你的例子对我也适用。不同之处在于,在您的示例中,使用了不同的jquery ui。这似乎是导致这种奇怪行为的原因。也许,如果您使用该版本会发生什么?将鼠标悬停在->更改大小,将其拖动,释放并移开指针->保留大小,而不是还原为初始大小