Skip to main content

Search and Top Navigation

#6928 closed bug (notabug)

Opened February 03, 2011 05:14AM UTC

Closed February 03, 2011 12:56PM UTC

hidden droppable gets drop, not top most droppable

Reported by: randynwalsh Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.droppable Version: 1.8.9
Keywords: Cc:
Blocked by: Blocking:

Here, the outterDiv (background-color: fuscha) always gets the drop, even though the inner div has a higher z-index and is overlay ontop.




<script src="" type="text/javascript"></script>

<script src="" type="text/javascript"></script>

<link href="" rel="stylesheet" type="text/css" />

<script language="Javascript" type="text/javascript">

$(function () {



drop: function (event, ui) {

$('#status').append('Dropped on ' + $(this).css('background-color') + '<br />');







<div id="outterDiv" class="droppable" style="height: 500px; width: 50%; background-color: Fuchsia; z-index: 200;">

<div class="draggable" style="position: absolute; top: 50px; left: 50px; width: 100px; background-color: Green; z-index: 1000;">

Hey! Drag me :)



<div class="droppable" style="position: absolute; top: 100px; left: 100px; width: 25%; height: 200px; background-color: Blue; z-index: 400;">


<div id="status" style="background-color: Gray; width: 50%; height:100px; overflow:auto;">




Attachments (0)
Change History (1)

Changed February 03, 2011 12:56PM UTC by scottgonzalez comment:1

component: ui.coreui.droppable
resolution: → invalid
status: newclosed

We don't support stacked droppables. See also #3452.