0

子要素の高さを動的に変更しようとしているコードがあり、何か奇妙なことに遭遇しています。これまでの私のコードは次のとおりです。

var heights = [],
    tallest;
$(window).resize(function() {
    $(elem).children().each(function (i) {
        heights[i] = $(this).height();
        tallest = Math.max.apply(null, heights);
        $(this).height(tallest);
    });
});

これは、各子要素の高さを見つけて配列にプッシュし、その配列で最大の値を見つけて、その値に基づいて高さを設定しようとするだけです。見つかった各子要素tallestは、サイズ変更時の変数値に応じて変化すると予想されますが、そうではなく、同じままです。ただし、このコードは機能します。

var heights = [],
    number = 1000;
$(window).resize(function() {
    $(elem).children().each(function (i) {
        heights[i] = $(this).height();
        tallest = Math.max.apply(null, heights);
         $(this).height(number--);
    });
});

ウィンドウのサイズを変更するheightと、属性は変数とインラインで変更されます。number何を与える？

2 番目のコードは機能し、最初のコードは機能しないのはなぜですか? それらは私にはほとんど同じコードのように見えます。

4

2 に答える 2

1

実際には最大高さを計算していないため、最大値はすぐには割り当てられません。最も高い値を取得するには、すべての子要素に対して実行する必要があります。そして、もう一度実行して各子に割り当てます。

 var heights = [],
        tallest;
    $(window).resize(function() {
        $(elem).children().each(function (i) {
            heights[i] = $(this).height();
        });
        tallest = Math.max.apply(null, heights);
        $(elem).children().each(function (i) {
            $(this).height(tallest);
        });
    });
于 2013-08-14T18:01:11.017 に答える