麦包包首页全屏可伸缩广告特效代码

版权：原创更新时间：1年以上

[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是麦包包首页全屏可伸缩广告特效代码的示例演示效果:

当前平台(PC电脑)

平台:

整屏预览

部分效果截图:

HTML代码(index.html):

<!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" />
<meta name="keywords" content="JS代码,全屏广告,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为麦包包首页全屏可伸缩广告，属于站长常用代码" />
<title>麦包包首页全屏可伸缩广告</title>
<link rel=stylesheet type=text/css href="css/xixi.css">
</head>

<body style="text-align:center">
<div style="margin: 0px auto; width: 960px; display: block" id=js_ads_banner_top>
	<a href="#" target=_blank><img src="images/banner_s.jpg" width=960 height=70></a>
</div>
<div style="margin: 0px auto; width: 960px; display: none" id=js_ads_banner_top_slide>
	<a href="#" target=_blank><img src="images/banner_b.jpg" width=960 height=400></a> 
</div>
<script type=text/javascript src="js/jquery.min.js"> </script>
<script type=text/javascript src="js/lrtk.js"> </script>
</body>
</html>

JS代码(lrtk.js):

//顶部伸展广告if ($("#js_ads_banner_top_slide").length){
	var $slidebannertop = $("#js_ads_banner_top_slide"),$bannertop = $("#js_ads_banner_top");
	setTimeout(function(){
	$bannertop.slideUp(1000);
	$slidebannertop.slideDown(1000);
}
,2500);
	setTimeout(function(){
	$slidebannertop.slideUp(1000,function (){
	$bannertop.slideDown(1000);
}
);
}
,8500);
}

CSS代码(xixi.css):