同じページで画像をリサイズする方法を教えてください

2007/06/21 03:52

このQ&Aのポイント

javascriptで、その場でアップロードした画像をリサイズして表示するスクリプトを作っているのですが、どうしても解決できない問題があります。
最初に画像をアップロードした時の画像サイズが、もう一度アップロードした時に反映されてしまうのです。（あるいは最初の画像サイズが指定したサイズにならない）
onChangeで読み込んでいるのが原因かも知れませんが、どんなに調べても対処法がわかりません。ページ更新などせずに、繰り返しアップロードしても、うまく画像がリサイズする方法を是非教えてください。

kurouz
お礼率68% (40/58)

JavaScript
回答数4
ありがとう数2

みんなの回答 （4）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

himajin100000
ベストアンサー率54% (1660/3060)

2007/06/21 06:52 回答No.1

とりあえず、考え中。検証環境: Minefield alertで何故か0が表示されてしまう Opera9.21 問題なし IE 7 問題なし。 while(!image.complete){}でループをかけて待機しようとするが定義されていいなくて抜け出せないのか(undefined?ただし未検証)固まってしまうため、記述していない。 Safari 3.0.1Beta for WinとIE 6,Firefox 2.0.0.4はこれから検証します。 Q3102596-2.html =================================== <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>実験</title> <script type="text/javascript" src="Q3102596-2.js"></script> </head> <body onload="init();"> <p><input type="file" onChange="dispImage(this.value);" /></p> <img id="p1" /> </body> </html> Q3102596-2.js ====================================== var image; function init(){ image = new Image(); } function dispImage(sSrc) { var p = document.getElementById("p1"); image.src = sSrc; alert(image.width); alert(image.height); if(image.width > 150){ p.height = (image.height / image.width) * 150; p.width = 150; p.src = sSrc; } else { p.height = image.height; p.width = image.width; p.src = sSrc; } alert(p.width); alert(p.height); } ===========================

その他の回答 (3)

himajin100000
ベストアンサー率54% (1660/3060)

2007/06/22 23:30 回答No.4

個人的に回答後に気になったことがあり，自分からQ3105481の質問を立てさせていただいきました。 steel_grayさんの回答は非常に参考になる検証結果 (ローカルでは動作するが，Webサーバ上にjsファイルと htmlファイルを置くと動作しなくなる) であると思いますので、運営に締め切り後の回答追加をお願いしました。 http://oshiete1.goo.ne.jp/qa3105481.html