js DIV延时几秒后消失或显示代码

时间:2022-12-13 05:30:38

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;font-size:12px;">
    恭喜你,操作成功!
</div>
</body>
</html>