Hi there everyone,
I'm trying to place multiple resizable and draggable div's on one page that move (vertically) inside their own parent div. you can take a look at http://bit.ly/bCutBE
However, these div's act really strange when I want to resize them, especially from the north side, they kind of move out of the screen very fast, while they shouldn't be able to get outside the parent div. I only want the div to be able to move and resize vertically inside it's parent, the dragging-part works pretty good, but the resize part give this problem.
I can't really describe it better than this, but take a look for yourself and it will be clear immediately when you try to resize one of the coloured div's: move it a little downwards and try to resize it from the north side.
the problem seems to be caused by the containment: 'parent', line of the resizable. when I delete this line it works fine, but then the coloured blocks don't stay in their parent, and I want them to stay inside their parent.
I hope someone can help me with this...
the jquery code I used:
$(document).ready(function(){
$(".move")
.draggable({
containment: 'parent',
grid: [50,50],
axis: 'y'
})
.resizable({
containment: 'parent',
grid: [50,50],
handles: 'n, s',
minHeight: 50
});
});