javascript - 将鼠标位置与 div 进行比较

Question

我试图通过获取鼠标的位置并将 i 与其他一些 div 进行比较来在拖动 div 时产生类似悬停的效果。我试过这样的事情：

$("#ha").draggable({
drag: function () {
    $(this).removeClass("halla");
    $("#align").remove();
    $(".box").each(function() {
        $(this).removeClass("halla");
        if (event.pageX > $(this).position().left && event.pageX < ($(this).position().left + $(this).width()) && event.pageY > $(this).position().top && event.pageX < ($(this).position().top + $(this).height())) {
            $(this).addClass("halla");
        }
    });
}
});

一个小提琴： http: //jsfiddle.net/9yyKN/8/
当鼠标在它上面时，每个对象的行为都不同。真的很奇怪。我究竟做错了什么？

*不要告诉我只使用 .hover()