使fancybox中的图像更大

Question

我正在使用 Fancybox 2.1.7，并且需要使弹出到 fancybox 中的图像大于原始图像的大小。我该如何控制？

链接示例：

<a href="https://dummyimage.com/300x200/000/fff.png" class="fb-movie2" data-fancybox-type="iframe2"><img src="https://dummyimage.com/300x200/000/fff.png"/></a>

我的脚本：

$(".fb-movie2").fancybox({
      'type' : 'image',
      'width' : 600,
      'height' : 400,
      'scrolling' : 'no',
      'autoSize' : false,
        helpers : {
            overlay : {
                locked : false,
                css : {
                    'background' : 'rgba(0, 0, 0, 0.8)'
                }
            }
        }  
      });

所以希望“fancybox”图像大 1.5 倍。

Answer 1

你可以试试这个代码。

$(".fb-movie2").fancybox({
      'type' : 'image',
       beforeShow: function () {
         $(".fancybox-image").css({
            "width": 1200,
            "height": 1200
        });
        this.width = 1200;
        this.height = 1200;
       },
      'width' : 600,
      'height' : 400,
      'scrolling' : 'no',
      'autoSize' : false,
        helpers : {
            overlay : {
                locked : false,
                css : {
                    'background' : 'rgba(0, 0, 0, 0.8)'
                }
            }
        }  
      });

这是一个codepen链接。

https://codepen.io/smitraval27/pen/VXbvrx/

更新

fancybox 版本 2.1.3+ 使用此代码。

http://jsfiddle.net/SmitRaval/kjr87zud/1/