Question

如果图像尺寸小于分配的图像div大小，我将面临一个添加边距/填充的问题。

要求：

如果图像尺寸小于div尺寸，则添加左/上边距，使其位于中心
图书馆：我正在使用diapo.js

到目前为止我做了什么：我将整个图像呈现在幻灯片中并为所有尺寸较小的图像指定边距。

这里的问题是当我使用每个函数遍历整个图像div时。我们没有得到正确的图像宽度和高度作为dipo库添加显示无（由于幻灯片）。

$('#imageDiv img').each(function(){  
    var theWidth = $(this).width();  
    var theHeight = $(this).height();  
    $(this).css({'margin-top': -theHeight / 2 + 'px', 'margin-left': -theWidth / 2 + 'px'});
});

我还试图在显示图像时使用。但是失败了:(

$('#wrapper > div:visible img').each(
        function(){
            var theWidth = $(this).width();
            var theHeight = $(this).height();
            $(this).attr("style","padding-left:"+(450-theWidth)/2+"px;padding-top:"+(338-theHeight)/2+"px");
            return;
        }
);

请建议如果有人做过某事或任何想法如何实现它。

由于

Answer 1

用于选择的jQuery：可见只会运行一次，并且在新幻灯片变为[可见]时将无法运行。我会检查插件提供的onEnterSlide回调，看看是否能满足你的需要。如果它在可见时为您提供图像，它应该适合您。否则，您可能不得不亲自动手并自行更改源代码（如果许可证允许的话）。

如何在幻灯片中获取图像的图像宽度/高度（调整大小并将其放在div的中心）

1 个答案: