阿里妈妈网站顶部banner代码

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

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

以下是阿里妈妈网站顶部banner代码的示例演示效果:

当前平台(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="此代码内容为阿里妈妈网站顶部banner代码，属于站长常用代码" />
<title>阿里妈妈网站顶部banner代码</title>
<link href="css/css.css" rel="stylesheet" type="text/css">

</head>

<body>
<div id=home_tx style="padding-right: 0px; padding-left: 0px; padding-bottom: 0px; margin: auto; overflow: hidden; width: 950px; padding-top: 0px; position: relative; height: 1px">
<div class=home_tx id=home_tx_in style="position: absolute; top: -37px; height: 37px" align=center>
<dl><img src="images/hometx_01.gif"></dl><span><b>程序员设计师联盟淘宝店 - 显而易见，最高的效率就是对现有材料的最佳利用。学会偷懒，并懒出境界是提高工作效率最有效的方法！</b> 
<a style="FLOAT: none" href="#" target=_blank>详情&gt;&gt;</a></span> <a style="cursor: pointer" onfocus=this.blur() onclick="home_tx_hide();return false;" href="##"><img src="images/hometx_04.gif"></a> </div></div>

<script src="js/lanren-tuku.js" type=text/javascript></script>

</body>
</html>

JS代码(lanren-tuku.js):

/**************************************************************�������������ͼ�⡡ ����ϧ�����Ͷ���ת�����Ծ�ע������**************************************************************/
var is_home_tx_show = false;
	var div_home_tx = document.getElementById("home_tx");
	var div_home_tx_in = document.getElementById("home_tx_in");
	var stepms = 10;
	function home_tx_show(){
	home_tx_stepshow();
}
function home_tx_stepshow(){
	var curHeight = parseInt(div_home_tx.offsetHeight);
	if(curHeight>=37){
	is_home_tx_show = true;
}
else{
	div_home_tx.style.height = (curHeight + 4) + "px";
	div_home_tx_in.style.top = (parseInt(div_home_tx_in.style.top)+4)+"px";
	window.setTimeout(home_tx_stepshow,30);
}
}
function home_tx_hide(){
	if(is_home_tx_show){
	home_tx_stephide()}
else{
	window.setTimeout(home_tx_stephide,1200);
}
}
function home_tx_stephide(){
	var curHeight = parseInt(div_home_tx.style.height);
	if(curHeight<=0){
	is_home_tx_show = false;
}
else{
	try{
	div_home_tx.style.height = (curHeight - 4) + "px";
	div_home_tx_in.style.top = (parseInt(div_home_tx_in.style.top)-4)+"px";
	window.setTimeout(home_tx_stephide,30);
}
catch(e){
}
}
}
if(window.addEventListener){
	window.addEventListener("load",home_tx_show,false);
}
else{
	window.attachEvent("onload",home_tx_show);
}

CSS代码(css.css):

body{margin:0px;padding:0px}
.home_tx{PADDING-RIGHT:0px;PADDING-LEFT:0px;BACKGROUND:url(../images/hometx_03.gif);PADDING-BOTTOM:0px;MARGIN:auto;OVERFLOW:hidden;WIDTH:950px;PADDING-TOP:0px}
.home_tx IMG{BORDER-TOP-WIDTH:0px;PADDING-RIGHT:0px;PADDING-LEFT:0px;BORDER-LEFT-WIDTH:0px;BORDER-BOTTOM-WIDTH:0px;PADDING-BOTTOM:0px;MARGIN:0px;PADDING-TOP:0px;BORDER-RIGHT-WIDTH:0px}
.home_tx DL{PADDING-RIGHT:0px;PADDING-LEFT:0px;FLOAT:left;PADDING-BOTTOM:0px;MARGIN:0px 10px 0px 0px;WIDTH:61px;PADDING-TOP:0px;HEIGHT:37px}
.home_tx SPAN{PADDING-RIGHT:0px;PADDING-LEFT:0px;FONT-SIZE:12px;FLOAT:left;PADDING-BOTTOM:0px;MARGIN:0px;WIDTH:830px;COLOR:#333333;LINE-HEIGHT:34px;PADDING-TOP:0px;HEIGHT:37px;TEXT-ALIGN:left}
.home_tx SPAN B{PADDING-RIGHT:0px;PADDING-LEFT:0px;FONT-WEIGHT:normal;FLOAT:left;PADDING-BOTTOM:0px;MARGIN:0px;COLOR:#990000;PADDING-TOP:0px}
.home_tx A{PADDING-RIGHT:0px;PADDING-LEFT:0px;FLOAT:right;PADDING-BOTTOM:0px;MARGIN:0px;WIDTH:35px;PADDING-TOP:0px;HEIGHT:37px}

附件:下载该文件资源,减少时间成本(增值服务)