I created a Mac like hierarchical folder tree type widget using jQuery UI. When the triangle next to a folder is clicked it causes an open folder to hide its contents using jQuery UI functions such as hide() or slideToggle(). I found that even though these elements were not displayed in the web browser they were still receiving many droppable() events such as ".drop" and ".over". These events did not occur at the location where the elements were just hidden, but rather at the very top parent div that contained the elements many levels lower.

I was able to correct the problem with the following function, but it seems to me that jQuery UI should never fire a "drop" or "over" event on an element that is set to CSS display:none (or if any of the parents() of the element are set to CSS display:none).

function eventShouldBeIgnored(item) {

var ignore = false;

$(item).parents().each(function() {

if ($(this).css("display") == "none") {

ignore = true;

}

});

return ignore;

}