Frage

When I drag my child div inside the parent div, it is disappearing when my mouse drags outside the boundaries. In the draggable Jquery documentation example, the child div cannot go beyond the boundaries of the parent container. Any thoughts on what my code is missing?

HTML markup:

<div class="containment-wrapper">
<div class="boxone" class="draggable ui-widget-content">
</div>

<div class="boxtwo" class="draggable ui-widget-content">
</div>



<div class="boxthree">
</div>

</div>

JavaScript:

$(".boxtwo").draggable({ containment: "#containment-wrapper", scroll: false });

$(".boxthree").draggable({ containment: "#containment-wrapper", scroll: false});

http://jqueryui.com/draggable/#constrain-movement (I'm looking at the "I'm contained within my box" example)

War es hilfreich?

Lösung

Change this:

$(".boxtwo").draggable({ containment: "#containment-wrapper", scroll: false });
$(".boxthree").draggable({ containment: "#containment-wrapper", scroll: false});

to this:

$(".boxtwo").draggable({ containment: "#containment-wrapper", scroll: false });
$(".boxthree").draggable({ containment: "parent", scroll: false});
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top