JavaScriptによる画像縮小 のバックアップの現在との差分(No.1)

• バックアップ一覧
• 差分 を表示
• ソース を表示
• バックアップ を表示
• JavaScriptによる画像縮小 へ行く。
  • 1 (2010-10-25 (月) 16:13:20)

• 追加された行はこの色です。
• 削除された行はこの色です。

目次
#contents

**概要 [#p75b2de3]
HTML表示段階で画像のリサイズを行うJavaScript。~
IMGタグにname属性を設定し、HTML読み込みの最後にname属性を取得してリサイズを行う。~
このため、縮小を行いたくない画像にはname属性を付けない（もしくは、img-resize以外のname属性を付ける）ことで縮小処理の対象外とすることができる。~

**HTML部（IMGタグ） [#d94536ac]
-縮小する場合~
 <IMG src="hogehoge.jpg" name="img-resize">

-縮小しない場合~
 <IMG src="hogehoge.jpg">

**JavaScript部 [#o687dc45]

-サイズの指定~
「var maxWidth」に横幅を指定する~

-name属性の指定~
「document.getElementsByName」のパラメータで指定する~

 <script type="text/javascript">
 //<![CDATA[
 var maxWidth = 50;
 window.onload = function(){
   var elements = document.getElementsByName("img-resize");
   for(i=0;i<elements.length;i++){
     if(elements[i].width > maxWidth){
       elements[i].width = maxWidth;
     }
   }
 }
 //]]>
 </script>