(function($){
    //Resize image on ready or resize
    $.fn.supersize = function() {
        //Invoke the resizenow() function on document ready
        $(document).ready(function() {
            $('#supersize').resizenow();
        });
        //Invoke the resizenow() function on browser resize
        $(window).bind("resize", function() {
            $('#supersize').resizenow();
        });
    };
    //Adjust image size
    $.fn.resizenow = function() {
        //Define starting width and height values for the original image
        var sw = 1280;
        var sh = 853;

        var bw = $(window).width();
        var bh = $(window).height();
        var rw = bw / sw;
        var rh = bh / sh;

        var cw, ch;

        $(this).width(bw);
        $(this).height(bh);

        if (rw > rh) {
            cw = sw * rw;
            ch = sh * rw;
        } else {
            cw = sw * rh;
            ch = sh * rh;
        }
        $(this).children().width(cw);
        $(this).children().height(ch);
        //Make sure the image stays center in the window
        $(this).children().css('left', (bw - cw)/2);
        $(this).children().css('top', (bh - ch)/2);
        $(this).find('img:hidden').show();
    };
})(jQuery);

$(document).ready(function() {
    //Invoking the supersized function on the div with id - supersize. It is the div that contains the large background image
    $("div#supersize").supersize();
    $("div#supersize").supersize();
});