javascript - 改变 JQuery droppable over 行为

Question

请查看我的源代码:http://jsfiddle.net/rAmSG/9/

蓝色项目应该放在其他 3 个 div 中的一个。这已经可以正常工作了。但我想在蓝色项目位于其他 div 之一上方时产生效果(并且鼠标尚未释放)。相应的 div 应该是灰色的(但只有最小的 div，就像放置行为一样)。

有没有人建议如何做到这一点？此外，我无法使“hoverClass”设置正常工作，是否也有解决方案？

提前致谢!

Answer 1

hoverClass 有问题，因为您使用 id 选择器为可放置元素定义背景颜色，即使您应用 dark，该规则也优先类的元素。

您可以使用 !important 增加 .dark 规则的优先级:

.dark {
    background-color: #333333 !important;
}

然后你可以按预期使用hoverClass:

$("#dropDiv1, #dropDiv2, #dropDiv3").droppable({
    greedy: true,
    drop: function() {
        $(this).css("background-color", "black");    
    },
    tolerance: "pointer",
    hoverClass: "dark"
});

你会发现一个更新的 fiddle here .