var pic_real_width;
var pic_real_height;
var iratio;

(function($){	
	$.fn.fullscreenr = function(options) {
		if(options.height === undefined) alert('Please supply the background image height, default values will now be used. These may be very inaccurate.');
		if(options.width === undefined) alert('Please supply the background image width, default values will now be used. These may be very inaccurate.');
		if(options.bgID === undefined) alert('Please supply the background image ID, default #bgimg will now be used.');
		var defaults = { width: 1280,  height: 1024, bgID: 'bgimg' };
		var options = $.extend({}, defaults, options);
		$(document).ready(function() { $(options.bgID).fullscreenrResizer(options);	});
		$(window).bind("resize", function() { $(options.bgID).fullscreenrResizer(options); });		
		return this;		
	};	
	$.fn.fullscreenrResizer = function(options) {
		var img = $(this)[0]; // Get my img elem
		var ihandle = this;
		$("<img/>").attr("src", $(img).attr("src")).load(function() {
			pic_real_width = this.width;   // Note: $(this).width() will not
			pic_real_height = this.height; // work for in memory images.
			iratio = pic_real_height/pic_real_width;
			var browserwidth = $(window).width();
			var browserheight = $(window).height();
			var ih=browserwidth * iratio;
			if(ih<browserheight){
				var iw=browserheight / iratio;
				$(ihandle).height(browserheight);
				$(ihandle).width(iw);
				var lp = (browserwidth-iw)/2;
				$(ihandle).css('left', lp+'px');
				$(ihandle).css('top', '0');
			}
			else{
				$(ihandle).width(browserwidth);
				$(ihandle).height(ih);
				$(ihandle).css('left', '0');
				$(ihandle).css('top', '0');
			}
		}).each(function(){
			}); 
		return ihandle;		
	};
})(jQuery);
		

//You need to specify the size of your background image here (could be done automatically by some PHP code)
var FullscreenrOptions = {  width: 1920, height: 1440, bgID: '.bgimg' };
// This will activate the full screen background!
jQuery.fn.fullscreenr(FullscreenrOptions);