/*
 * Image preview script 
 * powered by jQuery (http://www.jquery.com)
 * 
 * written by Alen Grakalic (http://cssglobe.com)
 * 
 * for more info visit http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery
 *
 */
jQuery.noConflict();
function returnSize() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {

    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
  var result = new Array(myWidth,myHeight);
  return result;
}

		
	
  (function($) {
  	$('p').css('color','#ff0000');
	 this.imagePreview = function(){
$("a.preview").hover(function(e){
		this.t = this.title;
		this.title = "";
		posY=0;
		posX=0;
		
		var c = (this.t != "") ? "<br/>" + this.t : "";
		$("body").append("<p id='preview'><img id='preview1' src='"+ this.href +"' alt='Image preview' />"+ c +"</p>");
				
	result=returnSize();
	var posX = 0, posY = 0;
	var myWidth=result[0];
	var myHeight=result[1];	
    var myScrollLeft=document.documentElement.scrollLeft;
	var myScrollTop=document.documentElement.scrollTop;
	var theImg = document.getElementById('preview1');
	var posX=myScrollLeft+myWidth/2-theImg.width/2;
	var posY=myScrollTop+myHeight/2-theImg.height/2;
	$("#preview")	
			.css("top",(posY) + "px")
            .css("left",(posX) + "px") 
			.css("display","block")
			.fadeIn("fast");
    },
	
	function(){
		this.title = this.t;
		$("#preview").remove();
    });
};



// starting the script on page load
$(document).ready(function(){
	imagePreview();
});
})(jQuery);
