html 鼠标事件，注释浮动框，提示文字

最新推荐文章于 2024-01-15 16:14:08 发布

fantasyagain

最新推荐文章于 2024-01-15 16:14:08 发布

阅读量1.1w

点赞数

分类专栏： web

web 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
	function showTip(e,temptx){
		//alert(e.clientX+"   "+e.clientY);
		if(document.all&&(document.readyState=="complete"||document.readyState=="interactive")){
			document.getElementById("flowarea").innerHTML='<table cellspacing="1" bgcolor="#CCCCCC" cellpadding="0"><tr><td><table bgcolor="#FFFFCC" valign="center"><tr><td>'+temptx+'</td></tr><tr><td><a href="javascript:void(0);" οnclick="closeTip();">【X】</a></td></tr></table></td></tr><table>';
			document.all.flowarea.style.pixelLeft=e.clientX+document.body.scrollLeft+10;
			document.all.flowarea.style.pixelTop=e.clientY+document.body.scrollTop+10;
			document.all.flowarea.style.visibility="visible";
		}else if(document.readyState=="complete"||document.readyState=="interactive"){
			document.getElementById("flowarea").innerHTML='<table cellspacing="1" bgcolor="#CCCCCC" cellpadding="0"><tr><td><table bgcolor="#FFFFCC" valign="center"><tr><td>'+temptx+'</td></tr><tr><td><a href="javascript:void(0);" οnclick="closeTip();">【X】</a></td></tr></table></td></tr><table>';
			document.getElementById("flowarea").style.left=e.clientX+document.documentElement.scrollLeft+100+'px';
			document.getElementById("flowarea").style.top=e.clientY+document.documentElement.scrollTop+100+'px';
			
			
			document.getElementById("flowarea").style.visibility="visible";
			
			alert(document.getElementById("flowarea").style.left+"  +  "+document.getElementById("flowarea").style.top);
		}else if(document.layers){
			document.flowarea.document.nstip.document.write('<b>'+'</b'); //some code between b
			document.flowarea.document.nstip.document.close();
			document.flowarea.document.nstip.left=0;
			//currentscroll=setInterval("pub_help_scrolltip()",100);
			document.flowarea.left=e.pageX+100;
			document.flowarea.top=e.pageY+100;
			document.flowarea.visibility="show";
		}
	}
	function pub_help_scrolltip(){
		if(document.flowarea.document.nstip.left>=-document.flowarea.document.nstip.document.width)
			document.flowarea.document.nstip.left=5;
		else
			document.flowarea.document.nstip.left=150;
	}
	function closeTip(){
		document.getElementById("flowarea").style.visibility="hidden";
	}
</script>
<body>
	<div id="flowarea" style="position:absolute;visibility:hidden;background-color:#FFFFCC;border:1px solid #aaa;padding:0px;z-index:999999; left:0; top:0">
	
	</div>
	<table>
		<tr>
			<td>
			
			11
			<span>
			<img src="1.jpg" style="width:50px;height:50px" onMouseOver='showTip(event,"hello world");'/>
			</span>
			</td>
			<td>
			12
			</td>
		</tr>
		<tr>
			<td>
			21
			</td>
			<td>
			22
			</td>
		</tr>
		<tr>
			<td>
			31
			</td>
			<td>
			32
			
			</td>
		</tr>
	</table>
	
</body>
</html>

fantasyagain

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
html 鼠标事件，注释浮动框，提示文字

Insert title herefunction showTip(e,temptx){//alert(e.clientX+" "+e.clientY);if(document.all&&(document.readyState=="complete"||document.readyState=="interactive")){document.getElementBy
复制链接

扫一扫