var bFadeIn = true;

function FullScreenBG() { 
  var $Site = $("#site");
  
  var ContentContainer        = $("#site");
  var BackContainer           = $("#background");
  var BackContainerImage      = BackContainer.find('img');
  var ImageWidth              = BackContainerImage.width();
  var ImageHeight             = BackContainerImage.height();

  var ContentContainerHeight  = parseInt(ContentContainer.outerHeight()); 
  var ContentContainerWidth   = parseInt(ContentContainer.outerWidth());
  
  BackContainer.css("overflow", "hidden");
  BackContainerImage.css("position", "absolute");
  
  var SiteHeight              = parseInt($Site.innerHeight());
  var ContainerHeight         = SiteHeight;

  BackContainer.height(ContainerHeight); // set height of the container so no scrollbar is measured
  
  var WindowHeight            = parseInt($(window).height());
  var WindowWidth             = parseInt($(window).width());
  
  BackContainer.width(WindowWidth);
  BackContainer.css("width", "100%");

  if(WindowWidth < ContentContainerWidth) {
    BackContainerImage.css('width', ContentContainerWidth + "px");
  } else {
    BackContainerImage.css('width', WindowWidth + "px");
  }
  BackContainer.css("width", BackContainerImage.width() + "px");
  
  var NewImageHeight = GetDimensionChange(ImageWidth, BackContainerImage.width(), ImageHeight);
  if(NewImageHeight > ContainerHeight) {
    BackContainerImage.css("top", (Math.floor(NewImageHeight - ContainerHeight) / 2) * -1 + "px");
    BackContainerImage.height(NewImageHeight);
    BackContainerImage.css("left", "0px");
  } else {
    BackContainerImage.css("top", "0px");
    BackContainerImage.height(ContainerHeight);
    var NewImageWidth = GetDimensionChange(ImageHeight, ContainerHeight, ImageWidth);
    BackContainerImage.width(NewImageWidth);
    if(WindowWidth < ContentContainerWidth) {
      BackContainerImage.css("left", (Math.floor(NewImageWidth - ContentContainerWidth) / 2) * -1 + "px");
    } else {
      BackContainerImage.css("left", (Math.floor(NewImageWidth - WindowWidth) / 2) * -1 + "px");
    }
  }

  BackContainer.height(parseInt($Site.innerHeight())); // height changes during process, so don't use SiteHeight.

  if(bFadeIn) {
    BackContainerImage.animate({opacity: 1}, "slow");  
    bFadeIn = false;
  } else {
    BackContainerImage.show();
  }
}

function GetDimensionChange(SrcDimension, NewDimension, DimensionValue)
{
  return DimensionValue * (NewDimension/SrcDimension);
}

