Filling background IMG

by PhilQ

HTML

<img id="home-back-img" src="https://fbcdn-sphotos-f-a.akamaihd.net/hphotos-ak-xap1/v/t1.0-9/10678539_10202260664418963_7205460113497002019_n.jpg?oh=41b2066e08e2b53dd12beaec14207f9e&oe=54C879D1&__gda__=1421094020_ea3045c4d380a2e3ff7006ff785f4db8" data-w="851" data-h="315" />

CSS

#home-back-img {
    position: fixed;
    top: 0px;
    left: 0px;
}

JavaScript

function updateBack() {
    var w = $(window).width();
    var h = $(window).height();
    var o_w = $("#home-back-img").data("w");
    var o_h = $("#home-back-img").data("h");
    var r = (w/h);
    var o_r = (o_w/o_h);
    if (o_r<r) {
        // hoger
        var n_r = (w/o_w);
    } else {
        // breder
        var n_r = (h/o_h);
    }
    var n_w = Math.round(o_w*n_r);
    var n_h = Math.round(o_h*n_r);
    var l = Math.round((w-n_w)/2);
    var t = Math.round((h-n_h)/2);
    $("#home-back-img").css({width: n_w, height: n_h, top: t, left: l, position: "fixed"});
}

updateBack();
$(window).resize(function(){
    updateBack();
});