博客列表 >下拉间隔提示框

下拉间隔提示框

Fire的博客
Fire的博客原创
2018年11月06日 10:21:403360浏览

下拉间隔延时提示框

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<style>
div {float:left; margin:10px;}
#div1 {width:50px; height:50px; background:red;}
#div2 {width:250px; height:180px; background:#CCC; display:none;}
</style>
<script>
window.onload=function ()
{
 var oDiv1=document.getElementById('div1');
 var oDiv2=document.getElementById('div2');
 var timer=null;
 
 oDiv2.onmouseover=oDiv1.onmouseover=function ()
 {
  clearTimeout(timer);
  oDiv2.style.display='block';
 };
 oDiv2.onmouseout=oDiv1.onmouseout=function ()
 {
  timer=setTimeout(function (){
   oDiv2.style.display='none';
  }, 500);
 };
};
</script>
</head>

<body>
<div id="div1"></div>
<div id="div2"></div>
</body>
</html>


  

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议