Mouseup,mousedown,mousemove, popup drag effect, JavaScript

<script type= "text/javascript" >
	var dialoginstace, Onmovestartid, Mousepos = {x:0,y:0}; Used to record objects that are currently draggable
	var zIndex = 9000;
	Get Element Object
	function g (ID) {return document.getElementById (ID);}
	Auto Center element (el = Element)
	function AutoCenter (EL) {
	var bodyw = document.documentElement.clientWidth;
	var bodyh = document.documentElement.clientHeight;
	var ElW = el.offsetwidth;
	var ElH = el.offsetheight;
	El.style.left = (BODYW-ELW)/2 + ' px ';
	El.style.top = (BODYH-ELH)/2 + ' px ';
	}
	Auto-extend element to all display area
	function Filltobody (EL) {
	El.style.width = document.documentElement.clientWidth + ' px ';
	El.style.height = document.documentElement.clientHeight + ' px ';
	}
	Methods of dialog instantiation
	function Dialog (Dragid, Moveid) {
	var instace = {};
	Instace.dragelement = g (Dragid); Elements allowed to perform drag-and-drop operations
	Instace.moveelement = g (Moveid); Moving elements during drag and drop operations
	Instace.mouseoffsetleft = 0; The starting X point of the moving element when dragging
	instace.mouseoffsettop = 0; Move the starting Y point of the element when dragging
	Instace.dragElement.addEventListener (' MouseDown ', function (e) {
	var e = e | | window.event;
	Dialoginstace = Instace;
	Instace.mouseoffsetleft = E.pagex-instace.moveelement.offsetleft;
	Instace.mouseoffsettop = E.pagey-instace.moveelement.offsettop;
	Onmovestartid = SetInterval (onmovestart,10);
	return false;
	Instace.moveElement.style.zIndex = ZIndex + +;
	})
	return instace;
	}
	Listening for mouse bounce events in the page
	Document.onmouseup = function (e) {
	Dialoginstace = false;
	Clearinterval (Onmovestartid);
	}
	Document.onmousemove = function (e) {
	var e = window.event | | E
	Mousepos.x = E.clientx;
	Mousepos.y = E.clienty;
	E.stoppropagation && e.stoppropagation ();
	E.cancelbubble = true;
	e = this.originalevent;
	E && (E.preventdefault e.preventdefault (): E.returnvalue = False);
	Document.body.style.MozUserSelect = ' None ';
	}
	function Onmovestart () {
	var instace = Dialoginstace;
	if (instace) {
	var MaxX = document.documentelement.clientwidth-instace.moveelement.offsetwidth;
	var maxy = document.documentelement.clientheight-instace.moveelement.offsetheight;
	Instace.moveElement.style.left = Math.min (Math.max ((Mousepos.x-instace.mouseoffsetleft), 0), MaxX) + "px";
	Instace.moveElement.style.top = Math.min (Math.max ((Mousepos.y-instace.mouseoffsettop), 0), Maxy) + "px";
	}
	}
	Readjust the position and mask of the dialog box and show
	function ShowDialog () {
	G (' Dialogmove '). style.display = ' block ';
	G (' mask '). style.display = ' block ';
	AutoCenter (g (' dialogmove '));
	Filltobody (g (' mask '));
	}
	Close the dialog box
	function Hidedialog () {
	G (' Dialogmove '). style.display = ' None ';
	G (' mask '). style.display = ' None ';
	}
	Listen for browser window size changes
	Window.onresize = ShowDialog;
	Dialog (' Dialogdrag ', ' dialogmove ');
	ShowDialog ();
	</script>

Mouseup,mousedown,mousemove, popup drag effect, JavaScript