fancybox图像上的自定义宽度和高度

我想知道在fancybox图像上设置自定义宽度和高度是否可行？

作为标准，fancybox的宽度和高度相对于图像的宽度和高度而变化，但我希望在所有图像中都是800宽度和600高度。

我想在Facebook上创建一个熟悉的图像框，在左边看图像，在右边看到描述和注释。

如果有人可以帮助我，这可能会很棒…… 🙂

• TheYaXxE

Answer 1

一种更简单的方法是使用beforeShow回调更改两者的大小，fancybox打开的图像和fancybox父容器，如：

 $(".fancybox").fancybox({ fitToView: false, // avoids scaling the image to fit in the viewport beforeShow: function () { // set size to (fancybox) img $(".fancybox-image").css({ "width": 800, "height": 600 }); // set size for parent container this.width = 800; this.height = 600; } }); 

请参阅JSFIDDLE

注意 ：这适用于fancybox v2.x +

---

编辑 （2014年4月）：

使用当前版本的fancybox（今天的v2.1.5），没有必要将css规则应用于.fancybox-image选择器，因为图像现在设置为响应（ max-width: 100%; ）。 this.width和this.height本身就可以解决问题

 $(".fancybox").fancybox({ fitToView: false, beforeShow: function () { this.width = 800; this.height = 600; } }); 

请参阅forked JSFIDDLE