Le confinement redimensionnable ne fonctionne pas

Question

J'ai fait un div draggable et redimensionnable. Le confinement sur draggable semble fonctionner mais il n'est pas redimensionnable. Est-ce que tu sais pourquoi ? Voici mon HTML:

<div class="page"> 
    <div class="area"></div> 
</div> 

Et mon code jquery est (où l'auto $ zone est l'objet jquery représentant le .Superficie div.):

self.$area.resizable({ 
     containment : 'parent', 
    }); 

    self.$area.draggable({ 
     containment : '.page', 
    }); 

Mon .Superficie est sur une position absolue et ma page est relative.

Merci pour votre aide.

Answer 1

Vous pouvez consulter cette demo JSFIDDLE pour une draggable + resizable simple avec containment

Code:

<div id="container" class="ui-widget-content"> 
<h3 class="ui-widget-header">Containment</h3> 
<div id="resizable" class="ui-state-active"> 
<h3 class="ui-widget-header">Draggable & Resizable</h3> 
</div> 
</div> 

<script> 
$(function() { 
    $("#resizable").draggable({containment: "#container"}).resizable({ 
containment: "#container" 
}); 
</script> 

});

Answer 2

J'ai trouvé une solution. Dans mon div j'avais un comme ça:

<div class="page"> 
    <img src="..." alt="" class="imgPage" /> 
    <div class="area"></div> 
</div> 

Les dimensions de l'image sont 100% * 100%. J'ai donc mis cette image pour le confinement et cela fonctionne ...

Merci.