jQuery 画像の横幅や高さを正しく取得する方法 – 画像の読み込み後に高さと横幅を取得

この記事は年前に書かれました。不適当な記述を含む場合がありますので、参考程度に留めてください。

どうもこんばんは。今回のtipsは【jQuery 画像の横幅や高さを正しく取得する方法】です。jqueryで要素の幅や高さを取得する際には$(‘対象’).height();や$(‘対象’).width();を用いますが、こと画像に関しては読み込みが正しく完了していない場合取得に失敗する事が有ります。今回はそれを避ける為のメモです。

【通常】横幅と高さの取得方法

DIVなど通常要素に対する取得方法は以下のような記述をします。


$(function(){
    $(‘.target’).height();
    $(‘.target’).width();
})

【画像】横幅と高さの取得方法

画像の場合以下のように記述します。


$("img").bind("load",function(){
    $(this).height();
    $(this).width();
});

　
今回は短いですが以上になります。