0

私はこのコードを持っています:

// gets the image size and position in order to make it fullscreen and centered.    
getImageDim = function(img) {
    var $img = new Image();
    $img.src = img;

    var $win = $(window),
        w_w = $win.width(),
        w_h = $win.height(),
        r_w = w_h / w_w,
        i_w = $img.width,
        i_h = $img.height,
        r_i = i_h / i_w,
        new_w, new_h, new_left, new_top;

    if (r_w > r_i) {    
        new_h = w_h;
        new_w = w_h / r_i;
    }
    else {    
        new_h = w_w * r_i;
        new_w = w_w;
    }

    return {
        width: new_w,
        height: new_h,
        left: (w_w - new_w) / 2,
        top: (w_h - new_h) / 2
    };
}

誰かが完全に理解するためにこれをスライスするのを手伝うことができますか?何r_wですか?何r_iですか?なぜ評価しているのr_w > r_iですか?最後にreturn関数が表示されますが、これらの、、、および値が割り当てられる要素widthheightどれleftですかtop?これを割り当てるポイントは何$img.src = img;ですか?前もって感謝します!

4

1 に答える 1

0

常に使用可能なスペースに合わせるには、アスペクト比を考慮する必要があります。これにより、画面/ウィンドウ/レイヤーが元の画像と同じa / rでない場合は、可能な限り最小限にトリミングされます。r_w> r_Iにはこの目的があります。幅[したがって、画像の上下をトリミング]または高さ[左/右をトリミング]を合わせる必要があるかどうかを選択してください。

于 2012-09-13T12:34:02.463 に答える