小编来给大家介绍js DIV延时几秒后消失或显示代码,这里我我介绍了利用js原生态的写法，然后讲述了利用jquery的写法，有需要的朋友可参考。
1、最常用的方法：
| 代码如下 |
|
|
<script language='javascript' type='text/javascript'>
$(function () {
setTimeout(function () {
$("divid").show();
}, 6000);
})
</script>
|
2、第二种方法
jquery 让一个div延时消失，纯jQuery,不用settimeout，就用jQuery写。
| 代码如下 |
|
|
<script language='javascript' type='text/javascript'>
$(document).ready(
function()
{
/**
*1.delay函数是jquery 1.4.2新增的函数
*2.hide函数里必须放一个0,不然延时不起作用
*/
$('#divid').delay(6000).hide(0);
}
);
</script>
|
完整实例
| 代码如下 |
|
|
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>div层延时消失</title>
<script>
function operate()
{
document.getElementById('div_test').style.display="";
setTimeout("disappeare()",2000);
}
function disappeare(){
document.getElementById('div_test').style.display="none";
}
</script>
</head>
<body>
<input type="button" onclick="javascript:operate()" value="操作"/>
<div id="div_test" style="display:none;color:white;line-height:25px;position:absolute;z-index:100;left:50%;top:2%;margin-left:-75px;text-align:center;width:150px;height:25px;background-color:green;font-size:12px;">
恭喜你，操作成功！
</div>
</body>
</html>
|
