页头下拉广告，加了关闭按钮，不闪屏-优快云博客

本文介绍了一种模仿163网站顶部大幅广告效果的实现方式，通过JavaScript动态调整广告高度并设置显示与隐藏定时器，实现了平滑过渡的广告展示效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

把图片地址换成你自己的图片就可以了

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>像163网站顶部展出的大幅广告</title>
<script type="text/javascript" language="javascript">
var time = 500;
var h = 0;
function addCount()
{
if(time>0)
{
time--;
h = h+5;
}
else
{
return;
}
if(h>=500) //高度
{
return;
}
document.getElementById("ads").style.display = "";
document.getElementById("ads").style.height = h+"px";
setTimeout("addCount()",30);
}

window.onload = function showAds()
{
addCount();
setTimeout("noneAds()",8000); //停留时间自己适当调整
}
</script>

<script type="text/javascript" language="javascript">
var T = 500;
var N = 500; //高度
function noneAds()
{
if(T>0)
{
T--;
N = N-5;
}
else
{
return;
}
if(N<=0)
{
document.getElementById("ads").style.display = "none";
return;
}

document.getElementById("ads").style.height = N+"px";
setTimeout("noneAds()",30);
}
</script>
</head>
<body>
<form id="form1" runat="server">
<div id="ads" style="margin:auto; display:none; width:100%; top:0px; height:0px; border:solid 1px #000; background-color:#fafafa; position:relative; overflow:hidden; text-align:center;">
<img src="C:\Documents and Settings\Administrator\My Documents\My Pictures\51.bmp" width="100%" alt="" /><div id="close" style="position:absolute; right:50px; bottom:20px; cursor:hand;" >
<img src='close.gif' onClick='javascript:document.getElementById("ads").style.display = "none";document.getElementById("close").style.display = "none"' width='100' height='14' border='0' vspace='3' alt='关闭广告'></div>
</div>

<div style="margin:auto; width:100%; height:200px; border:solid 1px #000; background-color:#fafafa; text-align:center;">
网站主体内容
</div>
<table><tr><td style="position:relative">

</td></tr></table>
</form>
</body>
</html>