Answer the question
In order to leave comments, you need to log in
Fancybox 1.3.1 - how to implement image size switching?
Hello!
I've been trying to make image resizing on click for three days now. So far, it has only been possible to open the original image in a new popup without the ability to return to the original one:
$('.gallery a').fancybox({
hideOnContentClick: false,
overlayShow: true,
overlayOpacity: 0.5,
zoomSpeedIn: 500,
zoomSpeedOut: 300,
titlePosition: 'inside',
cyclic: true,
onComplete: function(){
$('#fancybox-img').fancybox({
overlayShow: true,
overlayOpacity: 0.5,
zoomSpeedIn: 500,
zoomSpeedOut: 300,
hideOnContentClick: true,
autoScale: false,
titlePosition: 'inside',
cyclic: true
});
}
<ul>
<li>
<p class="gallery">
<a href="/images/content/img.jpeg">
<span id="selection_index9" class="selection_index"></span>Посмотреть отзыв
</a>
</p>
</li>
<li>...</li>
<li>...</li>
</ul>
<div id="fancybox-wrap" style="opacity: 1; width: 605px; height: 817px; top: 420px; left: 309px; display: block;">
<div id="fancybox-inner" style="top: 45px; left: 45px; width: 515px; height: 729px; overflow: hidden; display: block;">
<img id="fancybox-img" src="/images/content/img.jpeg">
</div>
<a id="fancybox-close" style="display: inline;"></a>
<a href="javascript:;" id="fancybox-left" style="display: inline;">
<span class="fancy-ico" id="fancybox-left-ico">
</span>
</a>
<a href="javascript:;" id="fancybox-right" style="display: inline;">
<span class="fancy-ico" id="fancybox-right-ico">
</span>
</a>
<div id="fancybox-title" class="fancybox-title-inside" style="width: 515px; padding-left: 45px; padding-right: 45px; display: block;">
<span>Lorem ipsum dolor sit amet
</span>
</div>
</div>
Answer the question
In order to leave comments, you need to log in
fancybox.net/api - can you find the function you need there?
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question