0

作業中のカスタムカルーセルがあります。以下はコードの一部です...巨大なので、完全に機能する例を示す必要はありません。

とにかく、画像のファイル名を含むphpからJSONオブジェクトを渡しました。右矢印をクリックすると、要素、

<img id="carousel_image" src="http://example.org/image/image.jpg" />

jQueryを使用して新しいsrcに変更します。

$('#arrow_right').click(function(){
        $('#carousel_image').attr('src', storedSlides[currentSlide]);
        $('#carousel_image').ready(function(){
           console.log($('#carousel_image').height()); //returns 1000
        });
        console.log($('#carousel_image').height()); //returns 1000
    });

どちらのログも、クリック前の元の画像の高さである1000を返します。新しい画像の実際の高さを取得するにはどうすればよいですか（完全に読み込まれた後）？

よろしくお願いします！

4

1 に答える 1

1

loadイベントを使用する必要があります。レンダリングready時にreadyが発生します。画像が要素にロードされたときに発生します。DOMloadimg

http://www.w3schools.com/jsref/event_img_onload.asp

$('#arrow_right').click(function(){
    $('#carousel_image').attr('src', storedSlides[currentSlide]);
    $('#carousel_image').on("load", function(){
       console.log($('#carousel_image').height());
    });
    console.log($('#carousel_image').height());
});
于 2013-03-26T00:37:27.003 に答える