您的位置：首页 > 编程语言

带滑动特性的符合Web标准的全屏广告特效代码

2009-03-26 18:01 337 查看

带滑动性质的全屏广告特效，设置一定时间可以自动关闭。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滑动全屏广告webjx.com</title>
<mce:script type="text/javascript" language="javascript"><!--
var intervalId = null;
function slideAd(id,nStayTime,sState,nMaxHth,nMinHth){
this.stayTime=nStayTime*1000 || 3000;
this.maxHeigth=nMaxHth || 300; //广告最大高度
this.minHeigth=nMinHth || 1;
this.state=sState || "down" ;
var obj = document.getElementById(id);
if(intervalId != null)window.clearInterval(intervalId);
function openBox(){
var h = obj.offsetHeight;
obj.style.height = ((this.state == "down") ? (h +5 ) : (h - 5))+"px";
if(obj.offsetHeight>this.maxHeigth){
window.clearInterval(intervalId);
intervalId=window.setInterval(closeBox,this.stayTime);
}
if (obj.offsetHeight<this.minHeigth){
window.clearInterval(intervalId);
obj.style.display="none";
}
}
function closeBox(){
slideAd(id,this.stayTime,"up",nMaxHth,nMinHth);
}
intervalId = window.setInterval(openBox,2);
}
// --></mce:script>
</head>
<body>
<div id="slideAD" style="overflow: hidden; height: 0">
<div align="center"><a href="#" mce_href="#"><img name="AD" src="" width="778" height="300" alt="广告内容webjx.com" style="background-color: #FF6600; border:0;" mce_style="background-color: #FF6600; border:0;" /></a></div>
</div>
<mce:script type="text/javascript"><!--
slideAd('slideAD',5);
// --></mce:script>
<div style="background-color:#0CF; border-top:2px #3399CC solid; font-size:12px; text-align:center; padding:3px;" mce_style="background-color:#0CF; border-top:2px #3399CC solid; font-size:12px; text-align:center; padding:3px;">滑动全屏广告webjx.com</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航