如何在彩色框中显示大于原始尺寸的图像？

Question

我在彩盒弹出窗口中显示500x500px图像（按链接中的类名分组），我希望将它们显示为大于原始大小（屏幕尺寸的90％将是完美的）。

我找不到任何增加图像大小的解决方案，但只能找到弹出窗口的大小。 更改加载图像的宽度和高度后调用的$ .colorbox.resize（）方法似乎无法正常工作。

如果图像大于屏幕的90％，则以下代码有效，但如果图像较小则无效。

$('.photos').colorbox({rel:'photos', maxHeight:'90%', maxWidth:'90%', scalePhotos:true});

如果我添加宽度：＆＃39; 90％＆＃39;，高度：＆＃39; 90％＆＃39;，只有颜色框采用正确的尺寸，但图像保持原始尺寸（500x500px）

有没有解决方案？

由于

Answer 1

我知道这是一个古老的问题，但我正在寻找类似的东西并最终在这里。

解决方案是添加到您的脚本

$('.photos').colorbox({rel:'photos', width:'90%'});

和你的css

img.cboxPhoto { width:100% !importatnt; }

通过Firebug或其他前端检查工具尝试。 我不是!important标签的粉丝，但我不知道另一种方法，因为colorBox直接将样式添加到元素而不是类。