Image resizable avec div

Bonjour,



J'ai un code qui permet de créer un nouveau div ainsi qu'un photo à l'intérieur de ce div:

var $img=$('<img id="'+id_max+'" src='+uri+' tabIndex='+page+' data="image'+id_max+'" alt="media" crossorigin="anonymous"  />').
                    css({
                       position:'static',
                       left:x+'px',
                       top:y+'px',
                       width:largeur+'px',
                       height:hauteur+'px',
                       "zIndex":100
                    });
            //var $new_div=$('<div id="'+id_max+'"  data="textuel'+id_max+'" class="draggable elm_div"  tabIndex='+page+' contenteditable="true" data-text="Votre texte ici"  style="color:black;  z-index:100; fontSize:16px; margin:0;padding:5px;position:absolute;top:'+posY+'px;left:'+posX+'px;width:150px; height:42px; border: 3px black solid; word-wrap: break-word; overflow:hidden; word-break:break-all; padding-left:10px;">'+text+'</div>');  
         
            var new_div=$('<div id="'+id_max+'"  data="textuel'+id_max+'" class="draggable elm_div"  tabIndex='+page+'></div>')
                    .css({
                       position:'absolute',
                       left:x+'px',
                       top:y+'px',
                       width:largeur+'px',
                       height:hauteur+'px',
                       "zIndex":100,
                        backgroundColor:"green",
                       
                    }).attr("tabIndex",page);
           
           new_div.append($img);

Ce div est draggable et résizable et ce que je veux c'est que l'image se déplace et s'agrandisse et se minimize en même temps que le div. Quand on déplace le div alors l'image se déplace aussi mais le problème est sur le resizable, lorsque j'agrandisse ou minimise le div alors l'image reste intacte:

Et je sollicite votre aide si vous pouvez rectifier mon code s'il vous plaît.

Cordiallement,