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)'
                }
            }
        }  
      });

这是一个代码链接。

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

更新

对于fancybox版本2.1.3+，请使用此代码。

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

使fancybox中的图像更大

1 个答案:

更新