延迟提示框(思路)

 1 <!doctype html>
 2 <html>
 3 <head>
 4     <meta charset="UTF-8">
 5     <script type="text/javascript" >
 6     window.onload=function(){
 7         var oDiv1=document.getElementById("div1");
 8         var oDiv2=document.getElementById("div2");
 9         var timer=null;
10         oDiv1.onmouseover=oDiv2.onmouseover=function(){
11             oDiv2.style.display='block';
12             clearTimeout(timer);
13         }
14         oDiv1.onmouseout=oDiv2.onmouseout=function(){
15             timer=setTimeout(function(){oDiv2.style.display='none';},300);
16         }
17     };
18     </script>
19  <style>
20     #div1{
21         width:200px;
22         height:100px;
23         background-color: red;
24     }
25     #div2{
26         width:150px;
27         height:80px;
28         background-color: pink;
29         margin:10px;
30         display:none;
31     }
32   </style>
33 </head>
34 <body>
35 <div id="div1">
36 </div>
37 <div id="div2">
38 </div>
39 </body>
40 </html>

 

posted @ 2017-05-04 22:48  杰森啊  阅读(250)  评论(0编辑  收藏  举报