Edit in JSFiddle

var backgroundResizerBlurrer = {
			
  imageAspectRatio: 0,

  setImageAspectRatio: function(width, height) {
    this.imageAspectRatio = width / height;
  },

  refreshBackground: function() {
    var windowWidth = $(window).width();
    var windowHeight = $(window).height();

    var currentWindowAspectRatio = windowWidth / windowHeight;

    //if the image aspect ratio is smaller than the current viewport's aspect ratio
    //then we adjust the width instead
    if (this.imageAspectRatio < currentWindowAspectRatio) {
      $(".wrapper").css({
        'background-size': windowWidth + 'px' + ' auto '
      });

      $(".modal .blurrer").css({
        'background-size': windowWidth + 'px' + ' auto '
      });
    } else {
      //otherwise we adjust the height

      $(".wrapper").css({
        'background-size': ' auto ' + windowHeight + 'px'
      });

      $(".modal .blurrer").css({
        'background-size': ' auto ' + windowHeight + 'px'
      });
    }

    //lastly get the position of the modal so we can adjust the background
    var modalPos = $(".modal").offset();
    $(".modal .blurrer").css({
      'background-position': "-" + modalPos.left + 'px' + " -" + modalPos.top + 'px'
    });
  }
};

$(function() {

  //we know our background's width and height so we'll set it here
  backgroundResizerBlurrer.setImageAspectRatio(2560, 1600);

  $(window).resize(function() {
    backgroundResizerBlurrer.refreshBackground();
  });

  backgroundResizerBlurrer.refreshBackground();

});