2011-12-08 23 views
1

私は現在、話すように "ギャラリー"のように動作するdivを持っています。JQueryを使ってdivの高さを制御する

div #Images { 
    max-height:90%; 
    height:500px; 
    position:relative; 
    overflow:hidden; 
} 

このdivの性質上、高さを置く必要があります。それ以外の場合は画像が表示されません。私がやりたいことは、JQueryを使って高さを設定し、リスト内で一番高い画像の高さにすることです。だから私はこれをやっている:

jQuery(document).ready(function($) { 

$(document).ready(function() { 
    var imageHeight = 0; 
     $("#wrap").find("img[id*='car_']").each(function(i) { 
         if (imageHeight < $(this).data('origHeight'))//.height()) 
       imageHeight = $(this).data('origHeight'); 
       }); 
     if (imageHeight > 0) 
     $("#Images").css('height', imageHeight); 
     else 
     $("#Images").css('height', 500); 
    }); 
}); 

残念ながら、imageHeightは私が警告(imageHeight)を追加した場合は0以外のものがここに....キッカーですなりません。 .each()の内部では最初は0ですが、それ以降は適切な値が設定されます。ポップアップが短い時間コードを中断していると仮定しています。すべての画像を完全にロードし、適切な高さを取得する時間。

残念ながら、毎回正しく身長を入力するためにポップアップを残すつもりはありません。

私は間違っていますか?

+2

は$(ウィンドウ).LOADを使用してみてください()。 $(document).ready()はDOMの終了を待つだけですが、画像の読み込みが完了するのを待ちます。 – JesseBuesking

+0

あなたは '// height()'を持っていて、次の行の高さではなくDOMラッパーを割り当てています – Halcyon

+0

.height()と.data()が同じものを返していた。 $(window).load()は何をしたのですか?ありがとう。 – MajinSephiroth

答えて

0

これは同じことを行いますがより明確である:

$(window).load(function() { 
    var imageHeight = 500; 
    $("#wrap").find("img[id*='car_']").each(function(i, o) { 
     imageHeight = Math.max(imageHeight, $(o).height()); 
    }); 
    $("#Images").css('height', imageHeight); 
}); 
+0

$(ウィンドウ).loadは、私が使用したはずのものです.FritsとJesseBに感謝します。 – MajinSephiroth

関連する問題