jquery - How to make resizable Fancybox v2 image and border change size together? -


i'm trying create resizable fancybox v2 window using jquery ui.

the thing happens - change image size or border size separately.

html:

<a rel="gallery" title="image" class="fancybox" href="http://fancyapps.com/fancybox/demo/2_b.jpg"><img src="http://fancyapps.com/fancybox/demo/2_s.jpg" alt=""/></a> 

resizable image: http://jsfiddle.net/g2pjr/

js:

$(".fancybox").fancybox({     arrows: false,     autoresize: false,     aftershow: function () {$('.fancybox-image').resizable();}     }); 

resizable border: http://jsfiddle.net/hrvka/

js:

$(".fancybox").fancybox({     arrows: false,     autoresize: false,     aftershow: function () {$('.fancybox-skin').resizable();}     }); 

how force image change size border?

jquery ui resizable widget includes alsoresize option bind resizable .fancybox-wrap selector , alsoresize .fancybox-inner , .fancybox-image selectors :

$(".fancybox").fancybox({     arrows: false,     autoresize: false,     aftershow: function () {         $('.fancybox-wrap').resizable({             alsoresize: ".fancybox-inner, .fancybox-image"         });     } }); 

see jsfiddle


Comments

Popular posts from this blog

c++ - Creating new partition disk winapi -

Android Prevent Bluetooth Pairing Dialog -

php - joomla get content in onBeforeCompileHead function -