没事写个幻灯片玩了一下，开始没有问题，挺好的，后来我把页面最小化了，然后再最大化之后，整个效果就错了，应该是id为ppt的滚动距离错了，不知道怎么回事，有人碰见过类似的问题吗？
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>幻灯片</title>
<style type="text/css">
*{ margin:0; padding:0; list-style:none;}
.pptWrap{ position:relative; width:800px; height:280px; background:#f2f2f2; margin:100px auto; overflow:hidden;}
.pptWrap img{ display:block;}
#ppt{ height:280px; display:block; position:absolute; left:0; top:0; width:800px;}
#ppt li{ float:left;}
.bot{ position:absolute; width:100%; height:30px; text-align:right; color:#000; bottom:0; left:0; z-index:100;}
.bot a{display:inline-block; height:18px; width:18px; font-size:14px; color:#fff; text-align:center; line-height:18px; border:1px solid #f4f4f4; background:#6CF; margin:5px 10px 0 0; text-decoration:none;}
.bot a.active{ border:1px solid #fff; color:#6CF; background:#FF9;}
.bg{ opacity:0.5; background:#000; position:absolute; bottom:0; left:0; width:100%; height:30px; z-index:99;}
</style>
</head>
<body>
<div class="pptWrap" id="pptWrap">
<ul id="ppt">
<li><img src="images/01.jpg" /></li>
<li><img src="images/02.jpg" /></li>
<li><img src="images/03.jpg" /></li>
<li><img src="images/04.jpg" /></li>
<li><img src="images/05.jpg" /></li>
</ul>
</div>
</body>
</html>
<script type="text/javascript">
window.onload=function(){
var now=0;
var timer=null;
var wrap=document.getElementById("pptWrap");
var ppt=document.getElementById("ppt");
var aLi=ppt.getElementsByTagName("li");
var step=aLi[0].offsetWidth;
var num=aLi.length;
ppt.style.width=step*num+"px";
var oDiv=document.createElement("div");
var oDivbg=document.createElement("div");
oDivbg.className="bg";
wrap.appendChild(oDivbg)
oDiv.className="bot";
for(var i=0;i<aLi.length;i++){
var aA=document.createElement("a");
if(i==now){
aA.className="active";
}
aA.innerHTML=i+1;
aA.setAttribute("href","#");
oDiv.appendChild(aA);
}wrap.appendChild(oDiv)
//生成按钮，且给按钮添加点击滚动效果
var aa=wrap.getElementsByTagName("a");
for(var i=0;i<num;i++){
(function(n){
aa[n].onclick=function(){
for(var j=0;j<num;j++){
aa[j].className="";
}
now=n;
aa[n].className="active";
move(ppt,-step*now);}
})(i)
}//鼠标移上计时器关闭
wrap.onmouseover=function(){
clearInterval(timer);
}//鼠标移开后计时器开启
wrap.onmouseout=function(){
timer=setInterval(function(){
for(var j=0;j<num;j++){
aa[j].className="";
}
aa[now].className="active";
move(ppt,-step*now);
now++;
if(now==num){
now=0;
}},2000)
}//默认鼠标移开
wrap.onmouseout();//运动框架
function move(obj,target){
var timer=null;
clearInterval(timer);
var speed=parseInt((target-obj.offsetLeft)/10);
timer=setInterval(function(){
if(obj.offsetLeft==target){
clearInterval(timer);
}else{
if(speed<1){
apeed=1;
}
obj.style.left=obj.offsetLeft+speed+"px";
}
},30)
}
}
</script>
没事写个幻灯片玩一下，发现了一个问题