2

Chrome が画像を開いた場合と同じように、画面に合わせて画像のサイズを自然なサイズから変更する必要がありますrescale(。この目的のために ) 関数を作成しました (以下)。

それはほとんど問題なく動作しますが、大きな横向きの画像(私の関数でサイズ変更した後に幅と高さの両方が画面を超える例http://imageontime.com/upload/big/2013/07/20/51ea60b522bba.jpg)フルスクリーン画像高さはまだ画面を数行超えています(幅はめったにありません)。そこで、より優れたリスケール JavaScript 関数があるかどうか、またはクロム ソース コードを調べて画像のサイズを変更できるクロム ソース専門家がいるかどうかを尋ねたいと思いました。それから機能するので、javascriptに移植できますか?

コードは次のとおりです。

function setautow() {
    img.style.width = 'auto';
    img.style.removeProperty("height");
    if (document.documentElement.clientHeight == 0) // Firefox again...
    {
        img.height = window.innerHeight;
    }
    else {
        img.height = document.documentElement.clientHeight;
    }
}

function setautoh() {
    img.style.height = 'auto';
    img.style.removeProperty("width");
    if (document.documentElement.clientWidth == 0) // FF
    {
        img.width = window.innerWidth;
    }
    else {
        img.width = document.documentElement.clientWidth;
    }
}

function shrink(a) {
    if (a) {
        if (img.width != document.documentElement.clientWidth) {
            setautoh();
        }
    }
    else {
        if (img.height != document.documentElement.clientHeight) {
            setautow();
        }
    }
}

var rescaled = false;

function rescale() {
    if (rescaled) {
        rescaled = false;
        img.height = img.naturalHeight;
        img.width = img.naturalWidth;
        img.style.removeProperty("height");
        img.style.removeProperty("width");
    }
    else {
        rescaled = true;
        if (img.naturalWidth > img.naturalHeight) {
            setautoh();
            setTimeout(function () {
                shrink(true);
            }, 0);
        }
        else {
            setautow();
            setTimeout(function () {
                shrink(false);
            }, 0);
        }
    }
}
4

2 に答える 2