続｜スマホ用画像サイズ自動変換スクリプト

＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
【3/22更新】
iOS、Androidともに実機テストをおこなって調整した結果、少し短くおさまりました。もちろんスマホの画面を縦横に回転しても対応できます。
※ついでにPCブラウザのウインドウサイズを変えた時にも対応してます(笑)
なお、下記ソースは新しい物に書き換えてあります。
￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣

とりあえずこれで落ち着いた。
htmlに埋め込んだスクリプトが長くなってしまったので、これもまた別に読み込む形にするつもり。

html埋め込み

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" src="js/imageResize.js"></script>
<script type="text/javascript">
    // カンプ作成時に想定していたサイトの全体幅を設定
    imageResize.config.iniSiteWidth = 480;
  
    // 画面の向きを変えた時の変換
    $(window).resize(function() {
        $('html').css('width', window.innerWidth);
        $('body').css('width', window.innerWidth);
        imageResize.setSize();
    });
  
    // 画像リサイズ
    imageResize.set(); 
</script>

imageResize.js

/*
 * imageResize.js
 * http://d.hatena.ne.jp/bondx2/
 *
 * @version
 * 1.0.0 (March 14 2012)
 * 1.2.0 (March 22 2012)
 *
 * @copyright
 * Copyright (C) 2012 http://d.hatena.ne.jp/bondx2/
 */

if ( ! window.imageResize ) var imageResize = function() {
    var isc = {
        // configuration
        config: {
            margin: 0
           ,iniSiteWidth : 0
        }
        ,items: null
        ,getItems: function(){
            if ( ! isc.items ) isc.items = function() {
                var m, i
                    ,images = document.getElementsByTagName("img")
                    ,items = new Array()
                ;
                for ( i = 0; i < images.length; i++ ) {
                    m = images[ i ];
                    items.push( {
                        originalWidth: m.width
                        ,originalHeight: m.height
                        ,img: m
                    });
                }
                return items;
            }();
            return isc.items;
        }
        ,setSize: function() {
            var w, h, m, i
                ,items = isc.getItems()
                ,config = isc.config
            ;
            for ( i = 0; i < items.length; i++ ) {
                m = items[ i ];
                w = m.originalWidth;
                h = m.originalHeight;
                m.img.width = (window.innerWidth * w) / config.iniSiteWidth;
                if((m.img.width % 2) == 1 ) {
                    m.img.width += 1;
                }
                m.img.height = h * (m.img.width / w);
                if((m.img.height % 2) == 1 ) {
                    m.img.height += 1;
                }
            }
        }
        ,set: function() {
            var f = isc.setSize;
            window.addEventListener( "load", f, false );
            window.addEventListener( "orientationchange", f, false );
        }
    };
    return isc;
}();