javascript中鼠标移动到文本上弹出可移动可关闭窗口层的代码

作者：简简单单 2012-08-16

提示：您可以先修改部分代码再运行

function trackmouse(evt){
	
	if((currID!=null)){
		var x=(IE5)? event.clientX+document.body.scrollLeft : evt.pageX;
		var y=(IE5)? event.clientY+document.body.scrollTop : evt.pageY;
		currID.style.left=x+xoff+'px';
		currID.style.top=y+yoff+'px';
		return false;
	}
}

function stopdrag(){
	currID=null;
	NS6bugfix();
}

function grab_id(evt){
	xoff=parseInt(evt.style.left)-((IE5)? event.clientX+document.body.scrollLeft : evt.pageX);
	yoff=parseInt(evt.style.top)-((IE5)? event.clientY+document.body.scrollTop : evt.pageY);
	currID=evt;

}

function NS6bugfix(){
	if(!IE5){
	self.resizeBy(0,1);
	self.resizeBy(0,-1);
	}
}

if(W3C)document.onmousemove=trackmouse;
if(W3C)document.onmouseup=stopdrag;
if(!IE5 && W3C)window.onload=NS6bugfix;

</script>

<div id="msgBox" class="msgBoxDiv">
	<div style="border: #036 solid; border-width: 1 1 3 1;  background: #fff; color: #036; font-size: 15px; line-height: 140%;">
		<div style="background: #036; height: 8%; font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 18px; padding: 3 5 0 0; color: #fff;text-align: center;" onmousedown="grab_id(msgBox);" onmouseup="stopdrag();">
			<div style="display: inline;  float: left; text-align: center; line-cursor:move">仲子说</div>
			<div onclick="msgBox.style.display='none';" style="float: left; display: inline; cursor: hand; line-" >×</div>
		</div>  
		<div align='center'><br /><a href="">仲子说的网址是：</a><br /><br />仲子说是我的个人网站，主要发表我的文章以及一些技术心得，欢迎大家常来看看:)
</div>
	</div>
</div>

提示：您可以先修改部分代码再运行

javascript中鼠标移动到文本上弹出可移动可关闭窗口层的代码

相关文章

精彩推荐