応答可能な画像でコンテナの高さを取得する

Question

div（イントロテキスト）を別のdiv（イントロコンテナ）に配置しようとしています。私はそれを行うためにCSSとjQueryを使用します。

.intro-text { 
width: 35%; 
margin-left: auto; 
margin-right: auto; 
display: block; 
} 

div（イントロテキスト）には、応答幅/高さを持つ画像があります。親コンテナ（イントロコンテナ）の幅は35％です。

コンテナ内に配置するためには、イントロテキストdivの高さが必要です。最初の負荷を除いて正常に動作します。 40px（テキストの高さ）を返します。

$(document).ready(function(){ 

     backgroundResize(); 

     $(window).resize(function(){ 
      backgroundResize(); 
     }); 
    }); 

function backgroundResize(){ 
console.log("height:" + $(".intro-text").height()); 
} 

イメージがまだロードされていないと思われるので、間違った値を返します。ドキュメントを使用できる準備が整っていてもどうすればいいですか？ HTMLドキュメントがロードされた後、すべてのコンテンツ（例えば、画像）もロードされたときにonloadイベントは、後で行われている間

<div class="intro-container container"> 
    <div class="intro-text"> 
    <p><img src="intro.png"><br> 
Address, Phone, .</p> 
    </div> 
</div> 

Answer 1

readyイベントが発生します。

onloadイベントでbackgroundResize（）関数を呼び出します。

$(document).ready(function(){ 

      $(window).resize(function(){ 
       backgroundResize(); 
      }); 

      $(window).load(function(){ 
       backgroundResize(); 
      }); 

     });