深入JS2.3

最新推荐文章于 2024-05-31 08:20:09 发布

wwwjiahuan

最新推荐文章于 2024-05-31 08:20:09 发布

阅读量225

点赞数

本文链接：https://blog.csdn.net/wwwjiahuan/article/details/54629963

版权

延时提示框



	
		
   
   
		time
	
	
	<script>
		window.οnlοad=function(){
			var oDiv1=document.getElementById('div1');
			var oDiv2=document.getElementById('div2');
			var timer=null;
			oDiv1.οnmοuseοver=function(){
				oDiv2.style.display='block';
				clearTimeout(timer);
			}
			oDiv1.οnmοuseοut=function(){
				timer=setTimeout(function(){oDiv2.style.display='none'},500);
			}
			oDiv2.οnmοuseοver=function(){
				clearTimeout(timer);
			}
			oDiv2.οnmοuseοut=function(){
				timer=setTimeout(function(){oDiv2.style.display='none'},500);
			}
		};
	</script>

<!DOCTYPE HTML>
<html>
	<head>
		<meta charset='utf-8'>
		<title>time</title>
	</head>
	<style>
		div{
			float: left;
			margin-left: 5px;
		}
		#div1{
			width: 50px;
			height: 50px;
			background-color: #ccc;
		}
		#div2{
			width: 100px;
			height: 100px;
			background-color: #444;
			display: none;
		}
	</style>
	<script>
		window.οnlοad=function(){
			var oDiv1=document.getElementById('div1');
			var oDiv2=document.getElementById('div2');
			var timer=null;
			oDiv2.οnmοuseοver=oDiv1.οnmοuseοver=function(){
				oDiv2.style.display='block';
				clearTimeout(timer);//清除定时器
			}
			oDiv2.οnmοuseοut=oDiv1.οnmοuseοut=function(){
				timer=setTimeout(function(){oDiv2.style.display='none'},500);//开启定时器
			}
		};
	</script>
	<body>
		<div id='div1'></div>
		<div id='div2'></div>
	</body>
</html>