function JsPopUpBox( sHtml , sTitle , nTop , nLeft ) {
/* 
* JsPopUpBox v.0.3
* http://maurizio.mavida.com/
* based on great jQuery  - http://jquery.com/
 
Use: 
*** direct mode ***
JsPopUpBox( "Hello world") // only popup body without title
JsPopUpBox( "Hello world","popup titile") // body e title
JsPopUpBox( "Hello world","popup titl",10,10)  // set top and left position

*** jquery  mode ***
var objpopup = JsPopUpBox( "Hello world" , "title") 
$(objpopup).css("top","50px")
$(objpopup).css("left","50px")
$(objpopup).fadeIn("slow")

*/
	var aPopup = new Array("");
	
	var PopUpCss = function ( ) {
	
			$("#PopUpBox").css({
				position:			"absolute",
				"background-color":	"#ccc",
				"top": 				"10px",
				left: 				"10px",
				height:				"250px",
				width:				"400px",
				"z-index":			"100",
				border:				"1px solid #000"
			});
			
			$("#PopUpBox #PopUpHead,#PopUpBox #PopUpClose").css({
				"background-color":	"#77829f",
				height:				"18px",
				"padding-top":		"2px",
				"border-bottom":		"1px solid #000",
				"font-family":		"verdana",
				color:				"#fff"
			});
			
			$("#PopUpBox #PopUpHead").css({
				"font-size": 		"14px",
				"text-align": 	"left",
				"padding-left": 	"10px",
				cursor:			"move",
				width:			"370px"
			});
			
			$("#PopUpBox #PopUpClose").css({
				"font-size":		"16px",
				"text-align":		"center",
				"font-weight":	"bolder",
				cursor:			"pointer",
				width:			"20px"
			});
		}	

	var PopUpMouseDown = function (e) {
			// compatibilità crossbrowser
			
			dragEnable = false
			
			if (!e) var e = window.event;
			objDrag = (e.target) ? e.target : e.srcElement

			// verifico se l'elemento è draggabile
			if ( objDrag.className=="drag"  ){

				
				dragEnable = true
				objDrag = objDrag.parentNode
				
				x = e.clientX - objDrag.style.left.replace('px','')
				y = e.clientY - objDrag.style.top.replace('px','')
				
				//abilito l'evento onmousemove e onmouseup
				$(document.body).mousemove(PopUpMouseMove)
				$(document.body).mouseup(PopUpMouseUp)

			} else {
				// esco dalla la modalità di drag
				dragEnable = false
				objDrag = null
				$(document.body).unmousemove(PopUpMouseMove)
				$(document.body).unmouseup(PopUpMouseUp)
			}
			//return false;
		}

	var PopUpMouseMove = function (e) {
			
			// movimento su drag attivato

			// se siamo in modalità di drag cambio le coordinate dell'elemento
			if (dragEnable){
				if (!e) var e = window.event;
				objDrag.style.left = (e.clientX -x )+"px"
				objDrag.style.top = (e.clientY  -y)+"px"
			}
			return false;
		}

	var PopUpMouseUp = function (e) {
			// esco dalla la modalità di drag
			dragEnable = false
			
			$(document.body).unmousemove(PopUpMouseMove)
			$(document.body).unmouseup(PopUpMouseUp)
			return false;
		}
		
	
	if ( $("#PopUpBox").size() == 0 ) {
		aPopup.push("<div id='PopUpBox'>\n")
		aPopup.push("<div class='drag' style='float:left' id='PopUpHead' >")
		aPopup.push(sTitle)
		aPopup.push("</div>\n<div style='float:right' id='PopUpClose'>x</div>\n")
		aPopup.push("<div id='PopUpText'></div>\n")
		aPopup.push("</div>\n")
		$(document.body).append( aPopup.join("") )
		PopUpCss()
		$("#PopUpBox #PopUpHead").mousedown( PopUpMouseDown )
		$("#PopUpBox #PopUpClose").click( function() { $("#PopUpBox").remove(); } )
		
	}
	
	if (nTop != undefined) $("#PopUpBox").css("top",top+"px"); 
	if (nLeft != undefined) $("#PopUpBox").css("left",left+"px"); 

	$("#PopUpBox #PopUpText").get(0).innerHTML = sHtml
	

	return $("#PopUpBox").get(0)
}

