﻿var imageWidth = 1600; // set the width and height of your images so that the calculated ratio is correct
var imageHeight = 1050; 

$(document).ready(function () {
    $(window).resize(function () {
        resizeImage();
    });

    resizeImage();
});

function resizeImage() {
    var navWidth = $(window).width();
    var navHeight = $(window).height();
    var navRatio = navWidth / navHeight;
    imageRatio = imageWidth / imageHeight;
    if (navRatio > imageRatio) {
        var newHeight = (navWidth / imageWidth) * imageHeight;
        var newWidth = navWidth;
    } else {
        var newHeight = navHeight;
        var newWidth = (navHeight / imageHeight) * imageWidth;
    }
    newTop = 0 - ((newHeight - navHeight) / 2);
    newLeft = 0 - ((newWidth - navWidth) / 2);
	
	$('.slidesContainer img').css({ 'height': newHeight, 'width': newWidth, 'top': newTop, 'left': newLeft });

}
