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
Post a Comment