首页 > 其他 > 详细

Day3-----delayPrompt

时间:2014-11-22 14:35:19      阅读:236      评论:0      收藏:0      [点我收藏+]

//------------------使用延时定时器完成提示框的延迟消失

<html>
<head><title>delayPrompt</title></head>
<style type="text/css">
#box{width: 500px;height: 500px;margin: 30px auto;background: pink;text-align: center;}
#prompt{width: 150px;height: 100px;margin: 10px;background: gray;float: left;visibility: hidden;}
#nav{float: left;width: 150px;height: 300px;background: #CC3;margin: 10px}
</style>
<script type="text/javascript">
window.onload=function(){
oPrompt=document.getElementById(‘prompt‘);
oNav=document.getElementById(‘nav‘);
var timer;
oNav.onmouseover=oPrompt.onmouseover=function(){
oPrompt.style.visibility="visible";
clearTimeout(timer);
}
oNav.onmouseout=oPrompt.onmouseout=function(){
timer=setTimeout(function(){oPrompt.style.visibility="hidden"},500);
}
}
</script>
<body>
<div id="box">
<div id="prompt">This is the delayPromptBox.</div>
<div id="nav">Show Box.</div>
</div>
</body>
</html>

Day3-----delayPrompt

原文:http://www.cnblogs.com/fleshy/p/4115048.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!