アプリ版：「スタンプのみでお礼する」機能のリリースについて

JavaScript/jQuery で元画像ファイルのサイズの取得

解決済

  • 質問者：seisuzuki
  • 質問日時：
  • 回答数：5件

JavaScript/jQuery で元画像ファイルのサイズの取得
次のコードを考えましたが、動作が不確定な点があります。状況と対応方策をお教えください。

<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="subf/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var pW;
var pH;
$(function() {
newImg();
alert(pW);
alert(pH);

});
function newImg() {
var newImg = new Image();
newImg.src = 'subf/' + "HighJinks_Ni.jpg";
alert("New Image"); //この行をコメントとすると pW=0,pH=0 となる。
　　pW=(newImg.width);
pH=(newImg.height);
}
</script>
</head>
<body>
</body>
</html>

　上のコードで画像のwidth とheight の値が得られるのですが、alert("New Image"); の行をコメントとすると、正確な値得られず０となります。
　対応の方法をお教えください。

通報する

この質問への回答は締め切られました。

質問の本文を隠す

A 回答 (5件)

No.3ベストアンサー

  • 回答者： fujillin
  • 回答日時：

ANo1です。



Imageオブジェクトにonloadイベントを設定できるみたいなので、こんなのでもいけると思います。

$(function() {
var newImg = new Image();
newImg.onload = function() { alert("width=" + newImg.width + " height=" + newImg.height); };
newImg.src = 'subf/' + "HighJinks_Ni.jpg";
});

（質問タイトルがjqueryなので、一応使ってますが、必要性はないですね）
    • good
    • 0
    • 件
通報する

No.5

  • 回答者： steel_gray
  • 回答日時：

コメントだけ。


＞#3 Imageオブジェクトにonloadイベントを
imgのonloadはキャッシュの関係（というかIEのせい）で残念な事にアテにできないです。
http://www.keyframe.co.jp/blog/archives/418
    • good
    • 0
    • 件
通報する

No.4

内容としては、No1さんの通りですね。


読み込む画像が複数ある場合は、下記を参考にするといいかもしれません。
JavaScript Image Preloader
http://www.webreference.com/programming/javascri …
    • good
    • 0
    • 件
通報する

No.2

  • 回答者： yyr446
  • 回答日時：

全角空白は半角空白になおしてね



<script type="text/javascript">
$(function(){
　var pW,pH;
　var newimg=newImg();
　var timer = setInterval(function(){
　 if(newimg.complete){
　　 pW=(newimg.width);
　　 pH=(newimg.height);
　　 complete();
　　 clearInterval(timer);
　 }
　},100);
　function complete(){
　 alert(pW);
　 alert(pH);
　}
});

function newImg() {
　newImg = new Image();
　newImg.src = 'subf/' + "HighJinks_Ni.jpg";
　return newImg;
}
</script>
    • good
    • 0
    • 件
通報する

No.1

  • 回答者： fujillin
  • 回答日時：

＞alert("New Image"); の行をコメントとすると、正確な値得られず０となります


画像を読込むのみ多少の時間がかかる場合、読み込み終了前にサイズを取得しようとすればundifinedや0が返ってくると予想できます。
（alertを実行させると、それが時間稼ぎになっている）
画像の読み込みが終了したかを確認してから、サイズを取得すればよろしいかと。

参考の記述は以下に
　http://naruken.cweb.tk/labo/java/view4.html
    • good
    • 0
    • 件
通報する

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう！

Q質問する（無料）

関連するカテゴリからQ&Aを探す

ページトップページトップ

Q質問する（無料）

デイリーランキングこのカテゴリの人気デイリーQ&Aランキング

マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング

おすすめ情報