Resizable and draggable jQuery overflow -
hi have site upload image in ajax in div, image mus resizable , draggable. problem if resize it, works, if drag seems there overflow:hidden because drag left image disappear after limit. have seen html code , there is
ui-wrapper style="overflow:hidden..." if put in stylesheet:
.ui-wrapper { overflow:visible !important; } drag works isn't resizable!!! how can solve it?
this code:
.ui-wrapper { overflow:visible !important; } $(document).ready(function(){ var options = { beforesubmit: showrequest, success: showresponse }; $('#upload-form').ajaxform(options); }); function showresponse(responsetext){ var id = 'image-resize_'+n_img_created; n_img_created++; $('<img class="draggable" id="'+id+'" '+responsetext+'/>').appendto("#space-drawable-div").resizable({ maxwidth: 212, maxheight: 220, start: function( event, ui ) { console.log('start resizable'); }, stop: function( event, ui ) { console.log('stop resizable'); } }).draggable({ containment: $('#space-drawable-div')}); }
wrap image in div. make div resizable , draggable. allow image resized, go ahead , use "alsoresize" option: $( ".divselector" ).resizable({ alsoresize: "#imageselector" });
what happens jquery ui resizable wrap image div (that's invisible part) if don't.
Comments
Post a Comment