Question

我有一个非常简单的产品图像布局和右边的未知数量的alt图像。

我需要一种方法来将alt设置为具有某种百分比，这使得它们都可以加到主图像的高度，这样我就能看到它。

我尝试过一些简单的jQuery，但它似乎没有给我我想要的布局。

这是我的小提琴http://jsfiddle.net/r7MgY/7112/

的链接

Answer 1

您的主要问题是您将小图像的高度设置为容器的％，而不是图像本身。您可以通过将大图像的高度设置为100％来解决此问题，或者计算大图像的高度/元素的数量以获得小图像的像素高度。

其次，您要在小图像上设置宽度而不是高度。

以下是您的脚本的编辑版本，可以帮助您：

$(function() {
    var altImages =$('div.alt').children('img');
    var altCount = altImages.length;

    var smlHeight = Math.floor($('#big').height() / altCount);
    smlHeight -=2; //account for borders
    smlHeight -=2; //account for padding
    smlHeight -=2; //account for margins

    altImages.css('width',smlHeight + 'px');
    $('.alt').css('width',smlHeight + 'px');
});

注意：

您必须在大图片中添加ID（我假设id ='big'）
您必须调整边框，填充和边距的偏移量。它们还不是很正确，但有些玩法你应该能够得到它。

使用Jquery或Css设置未知数量元素的高度或宽度

1 个答案: