2

HTML ソースで幅と高さのタグが指定されていない画像の高さと幅を取得したいと考えています。

すなわち

<img src="http://www.mysite.com/imge.jpg" id="my_img" />

私がやりたいのは、画像が読み込まれる前に画像の幅と高さを取得することです。次のタスクを達成しようとしています。より良い解決策を知っている場合は、提案してください。

サイト内のすべての画像を 600px 以下に保ちたいので、これを行いたいと考えています。したがって、画像の幅が 600px を超える場合は、600px に縮小します。または、幅を変更しないままにします。

私の試行: 以下のコードは、画像が読み込まれると画像のサイズを取得するため、このタスクでは機能しません。最初は、幅にゼロが表示されます。

<script type="text/javascript">
  var img = document.getElementById('my_img');
  var width = img.clientWidth;
  var height = img.clientHeight;
  alert('Width: ' + width + ' Height:' + height); // FAIL

  var timg = document.getElementById('test').width;
  alert(timg);  // FAIL too
</script>

私のHTMLコード:

<img src="http://www.mysite.com/imge.jpg" id="my_img" />

これが明確であることを願っています。

ありがとうございました。

4

1 に答える 1

6

jsフィドル

JavaScript を使用する理由 この CSS ルールを使用すると、幅を600px次のように制限できます。

#my_img { max-width:600px; }
于 2012-12-25T07:58:18.497 に答える