jquery dom resizable draggable containment issue
-
24-10-2019 - |
Question
Why is jquery resizable() not resizing to full width and height of the containment id assigned to it. You can try it at http://jsfiddle.net/C8YSU/6/ and see what i mean. Try to resize the created div, it will not resize to full width and height on the parent #container div. This seems to be caused by the draggable()
function.
Solution
Adding a relative position to the #container div fixed the problem.
OTHER TIPS
<script type="text/javascript">
$("button").click(function () {
var elm = $('<div id="divId" class="adiv abs"></div>');
elm.appendTo('#container').resizable({
containment: "parent"
});
});
</script>
Update
<script>
$("button").click(function () {
var elm = $('<div id="divId" class="adiv abs"></div>');
elm.appendTo('#container').draggable({
snap: true,
containment: 'parent'
}).resizable({
maxWidth: 300,
maxHeight: 300
});
});
</script>
It is a problem with adding draggable to it.
Try this example. Removed draggable, but added handles.
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow