hi
hope this is possible... i have a list on the right hand side.. need
to drag it out of the right hand side into the left hand side... the
right hand column is positioned inside a div with overflow hidden then
inside another div (both position absolute) with overflow: auto (the
second div has auto)
when i drag a list item... it renders as "hidden" as soon as it goes
outside the divs. anyways past it?
heres some demo code
<script>
$(document).ready(function () {
$(".dragable").draggable({
opacity: 0.8,
helper: 'clone',
containment: false,
zIndex: 2710,
stop: function(event, ui) {
if (ui.helper !== null) {
console.log(ui.position);
}
}
}).disableSelection()
});
</script>
<style type="text/css">
<!--
#right {
border: 1px solid #000;
overflow: hidden;
position: absolute;
width: 200px;
top: 10px;
right: 10px;
bottom: 10px;
}
#dragzone {
position:absolute;
top:0px;
bottom:0px;
left:0px;
right:0px;
overflow:auto;
}
.dragitem {
padding: 2px;
margin-top: 3px;
margin-bottom: 3px;
border: 1px solid #CCC;
background-color: #CF6;
display: block;
width:190px;
}
-->
</style>
<div id="right">
<div id="dragzone">
<div class="dragitem">test 1</div>
<div class="dragitem">test 2</div>
<div class="dragitem">test 3</div>
<div class="dragitem">test 4</div>
</div>
</div>