标签：
@charset "utf-8";
/* CSS Document */
*{ margin:0px;
padding:0px;
}
a{ text-decoration: none; color:#C60;}
.a
{
width:100%;
height:120px;
position: relative; z-index:9999;
background-color:#000;
}
.c
{
width: 800px;
height: 100px;
position: absolute;
left: 607px;
top: 65px;
}
.c ul
{
list-style:none;
}
.c ul li{
width:150px;
float:left; font-size:21px;
text-align:center;
line-height:50px;
margin-right:1px;
padding:0px,10px;
background-color:#0c0;
}
.c li :hover{ background-color:#000;
}
.b{
width:150px;
height:150px;
position:fixed;
right:0px;
top:50%;
}
.b ul{
list-style:none;
}
.b ul li { width:150px;
height:50px;
background-color:#090;
line-height:55px;
margin-bottom:2px;}
#tuijian{ width:760px; height:500px; background-repeat:no-repeat; background-size:contain; }
.pages{
top: 104px;
background-color: #03F;
background-position: center;
background-repeat: no-repeat;
opacity:0.6;
width:200px;
height: 50px;
}
#p1{
background-image:url(imges/29.jpg);
margin:200px 0px 0px 10px;
position: absolute;
right:0px;
}
#p2{ background-image:url(imges/28.jpg); float:right; margin:200px 10px 0px 0px; position:absolute; }
.d{
width: 80%;
height: 521px;
border: 1px;
position: absolute;
top: 180px;
left: 10%;
background-size:cover;
border: 1px solid;
}
<!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=utf-8" />
<title>制作工厂</title>
<link href="制作工厂.css" rel="stylesheet" type="text/css" />
</head>
<body background="imges/10.jpg" style=" background-repeat:no-repeat ; background-size:cover;" >
<div class="a" >
<img src="imges/3.png" width="854" height="148" />
<div class="c">
<ul>
<li><a href="baleite.html">基本信息</a></li>
<li><a href="白雷特2.html">技术性能</a></li>
<li><a href="1-1210230JI3/jQuery全屏带缩略图的动感相册特效/index.html">图片展示</a></li>
<li><a href="制作工厂html.html">制作工厂</a></li>
<li>游戏图片</li></ul>
</div>
</div>
<div class="d" align="center">
<div id="tuijian" style=" background-size:containbackground-image:url(imges/1.jpg)" ></div>
<div class="pages" id="p1" onclick="dodo(-1)"></div>
<div class="pages" id="p2" onclick="dodo(1)"></div>
</body>
</html>
<script language="javascript">
var jpg =new Array("url(imges/2.jpg )","url(imges/19.jpg)","url(imges/1.jpg)");
var tjimg = document.getElementById("tuijian");
var xb=0;
var n=0;
function huan()
{ xb++;
if(xb == jpg.length)
{ xb=0;
}
tjimg.style.backgroundImage=jpg[xb];
if(n==0)
{ var id = window.setTimeout("huan()",3000);
}
}
function dodo(m)
{ n=1; xb = xb+m;
if(xb < 0)
{ xb = jpg.length-1; }
else if(xb >= jpg.length)
{ xb = 0; }
tjimg.style.backgroundImage=jpg[xb]; }
window.setTimeout("huan()",1000);
</script>
标签：
原文地址：http://www.cnblogs.com/lulichao/p/5789239.html
