模态中的Fancybox图像大小

Question

我需要知道div fancybox-image

中的fancybox 2图像大小

我想在fancybox下添加div，它是图像的100％。问题是我不能有100％的宽度div，我尝试添加box-sizing属性...等div唯一的方法就是添加jquery div size class：

$(".divtitle").css("width", ""+imgsize +"px");

问题是我需要知道灯箱中的当前图像大小，才能将类添加到div。 我试过了：

var imgsize = $(".fancybox-image").width();

如果在fancybox中只有1张图片，它会有效，但在使用图库时，它会返回图库中下一张图片的大小

我想我应该使用类似的东西：

var imgsize = $ this.find（＆＃34; .fancybox-image＆＃34;）。width（）;但没有工作......

Answer 1

如果您想要附加DIV来放置title，那么我宁愿操纵fancybox title选择器以获得相同的效果：

$(".fancybox").fancybox({
    padding: 0,
    helpers: {
        title: {
            type: "inside"
        }
    }
});

这将生成您可以通过css操作的选择器.fancybox-title-inside-wrap，如：

.fancybox-title-inside-wrap {
    background-color: #33CCFF;
    padding: 5px 10px
}

这样您就不必计算任何尺寸，因为title将填充图像的100％宽度。

参见 JSFIDDLE