使用jquery或css設置未知數量元素的高度或寬度

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 =」大'）
• 你將不得不調整邊界，填充和邊距的偏移量。他們還不完全正確，但有些玩法你應該能夠得到它。