从右上角滑开的大幅广告效果
本帖最后由 小麦子 于 2024-10-19 00:20 编辑从左上角滑开的大幅广告效果,只实现了最基本的代码,还需要根据你的网页风格再次美化,这个工作交给你来完成了。这个广告效果很实用,当网页打开的时候,广告从左上角滑开,在指定时间到达时自动关闭。
演示如下:
<title>从左上角滑开的大幅广告效果</title>
<script type="text/javascript" language="javascript">
var time = 500;
var w = 0;
function addCount()
{
if(time>0)
{
time--;
w = w+5;
}
else
{
return;
}
if(w>278)//宽度
{
return;
}
document.getElementById("ads").style.display = "";
document.getElementById("ads").style.width = w+"px";
setTimeout("addCount()",30);
}
window.onload = function showAds()
{
addCount();
setTimeout("noneAds()",7000); //停留时间
}
</script>
<script type="text/javascript" language="javascript">
var T = 198;
var N = 188; //高度
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.width = N+"px";
setTimeout("noneAds()",30);
}
</script>
</head>
<body>
<div id="ads" style="margin:auto; display:none; position:absolute;width:200px; top:0px; right:0; height:200px;background-color:#d5282e; overflow:hidden; text-align:center;">
<img src="广告图片地址" border="0" alt=""/>
</div>
<br />
</body>
页:
[1]