有段JS希望大家帮我看下

window.onload=function(){
var opt=document.getElementById('pt');
var oul=opt.getElementsByTagName('ul')[0];
var oli=oul.getElementsByTagName('li');
var tpage=document.getElementById('anshang');
var bpage=document.getElementById('anxia');
//var obpic=opt.getElementsByTagName('div');
var speed=-45;
//oul.style.height=oli[0].offsetHeight*oli.length+'px';
for(var i=0;i<oli.length;i++)
{
oli[i].onclick=function(){
//oli[i].index=i;
setTimeout(function(){
oul.style.top=oul.offsetTop+speed+'px';
if(oul.offsetTop<-oul.offsetHeight/2){
oul.style.top='0px';
}
},300);
for(var i=0;i<oli.length;i++)
{
oli[i].className='';
//obpic.style.display='none';
}
this.className='active';
//obpic[this.index].style.display='block';
}
tpage.onclick=function(){
speed=25;
if(oul.offsetTop<-oul.offsetHeight/2){
oul.style.top='0px';
}else{
oul.style.top=oul.offsetTop-speed+'px';}
};
bpage.onclick=function(){
speed=-25;
if(oul.offsetTop<-oul.offsetHeight/2){
oul.style.top='0px';
}else{
oul.style.top=oul.offsetTop+speed+'px';}
}; }
}
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"/>
<title>df</title>
<style type="text/css">
*{margin:0;padding:0;}
.pt{height:405px;overflow:hidden;position:relative;}
.anxia,.anshang{margin-left:25px;}
.pt li{list-style-type:none;border:1px solid #ccc;padding:2px 3px;margin:5px 0;height:80px;}
.pt ul{position:absolute;top:0;}
.pt .active{border:2px solid #0066cc;}
.b-pic{display:none;width:344px;height:405px;margin-left:150px;border:1px solid #ccc;}
</style>
<script type="text/javascript" src="show.js"></script></head>
<body>
<div id="leftpd">
<p id="anshang" class="anshang"><img src="img/h_top.gif"></p>
<div id="pt" class="pt">
<ul>
<li class="active"><img src="img/s1-70X75.jpg"></li>
<li><img src="img/s1-70X75.jpg"></li>
<li><img src="img/s1-70X75.jpg"></li>
<li><img src="img/s1-70X75.jpg"></li>
<li><img src="img/s1-70X75.jpg"></li>
<li><img src="img/s1-70X75.jpg"></li>
</ul>
<div id="b-pic" class="b-pic" style="display:block;">
<img src="img/big.jpg"/>
</div>
<div id="b-pic" class="b-pic">
<img src="img/big2.jpg"/>
</div>
<div id="b-pic" class="b-pic">
<img src="img/big3.jpg"/>
</div>
<div id="b-pic" class="b-pic">
<img src="img/big4.jpg"/>
</div>
<div id="b-pic" class="b-pic">
<img src="img/big5.jpg"/>
</div>
<div id="b-pic" class="b-pic">
<img src="img/big.jpg"/>
</div>
</div>
<p id="anxia" class="anxia"><img src="img/h_bottom.gif"></p>
</div></body>
</html>
为什么不能在点击的时候，右边的大图也跟着切换啊
大家可以随便去网上找几张小图和大图，谢谢了

解决方案 »

  1.   

    window.onload=function(){
        var opt=document.getElementById('pt');
        var oul=opt.getElementsByTagName('ul')[0];
        var oli=oul.getElementsByTagName('li');
        var tpage=document.getElementById('anshang');
        var bpage=document.getElementById('anxia');
        var obpic=opt.getElementsByTagName('div');
        var speed=-45;
        var old ;
        //oul.style.height=oli[0].offsetHeight*oli.length+'px';            
        for(var i=0;i<oli.length;i++)
        {    
            oli[i].setAttribute("index",i)
            oli[i].onclick=function(){
                    //oli[i].index=i;
                    var index = parseInt(this.getAttribute("index"))                         
    if(old) old.style.display="none";
                    old = obpic[index]
                    old.style.display="block"
                    setTimeout(function(){
                    oul.style.top=oul.offsetTop+speed+'px';
                    if(oul.offsetTop<-oul.offsetHeight/2){
                        oul.style.top='0px';
                    }
                    },300);
                    for(var i=0;i<oli.length;i++)
                    {
                        oli[i].className='';
                        //obpic.style.display='none';
                    }
                    this.className='active';
                    //obpic[this.index].style.display='block';
            }
            tpage.onclick=function(){
                speed=25;
                if(oul.offsetTop<-oul.offsetHeight/2){
                    oul.style.top='0px';
                }else{
                oul.style.top=oul.offsetTop-speed+'px';}
                };
            bpage.onclick=function(){
                speed=-25;
                if(oul.offsetTop<-oul.offsetHeight/2){
                    oul.style.top='0px';
                }else{
                oul.style.top=oul.offsetTop+speed+'px';}
                };        }    
    }
    会切换了