jquery - ウェブページの初期読み込み時に jQuery で画像のサイズを変更する

Question

わかりました、MAC OSX の Google Chrome でこのページを見てください: http://opportunityfinance.net/Test/2013conf/index.html

下にスクロールすると、次のように表示されます。

ブラウザー ウィンドウのサイズを変更すると、次の図のように正しく配置されます。

それで、私の質問は、ページの最初の読み込み時に2番目の写真の外観を取得するにはどうすればよいですか? Google Chrome は<div class="gold">、次のコードを使用して最初に の高さを 0px に設定します。

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

    var gold = $(".gold");

    $(window).bind("resize", function(){
        gold.css({'height': gold.children(":first").children("img").height()});             
    }).trigger("resize");
});

私が使用しているHTMLは次のとおりです。

<div class="gold" style="width: 100%; position: relative; margin-top: 1em; margin-bottom: 1em;">
    <div style="position: absolute; bottom: 0px; right: 0px; width: 32%;">
        <img src="images/wellsfargo.png" alt="Wells Fargo" style="border: none; max-width: 100%;">
    </div>
    <div style="float: left; width: 32%; bottom: 0px; left: 0px; position: absolute;">
        <img src="images/citi.png" alt="Citi" style="max-width: 100%; border: none;">
    </div>
    <div style="margin: 0 auto; width: 34%; position: absolute; bottom: 0px; left: 0px; right: 0px;">
        <img src="images/gs10ksb.png" alt="Goldman Sachs 10000 Small Businesses" style="border: none; max-width: 100%;">
    </div>
</div>