同じ行にロゴ (静的) とページ ヘッダー (これは変更されます) のリストがあります。ページヘッダーが占めていない残りのスペースに、ロゴ (スペースに表示するには多すぎる) を動的に合わせたいと考えています。
アプローチ:
- 最初にロゴを非表示
1.) leftoverSpace = containerWdith - pageheaderWidth
2.) 各ロゴの幅をループします
。 3.) 「leftoverSpace」の数値に達すると、ループが停止します。
これは私がこれまでに得たものです。正しくありませんが、試しています。
var pageheaderWidth = null;
brandsbannerWidth = null;
pageheaderWidth = $(".page_header h1").width()
pageheaderWidth = pageheaderWidth + 40;
brandsWidth = (960-pageheaderWidth)-10
$(".brands_banner li").each (function(index) {
brandsbannerWidth = $(this).width();
if(brandsbannerWidth == brandsWidth)
$(this).show();
});
助けていただければ幸いです。前もって感謝します。