请问这个有什么问题吗

N122211 2017-11-21 10:34:35

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>try one</title>
<link rel="stylesheet" type="text/css" href="zns_style.css"/>

<script type="text/javascript">
function getByClass(oParent,sClass){
var aEle=oParent.getElementsByTagName('*');
var aResult=[];
for(var i=0;i<aEle.length;i++){
if(aEle[i].className==sClass){

aResult.push(aEle[i]);
}
}
return aResult;
}
window.onload=function(){
var oDiv=document.getElementById('playimages');
var oBtnPrev=getByClass(oDiv,'prev')[0];
var oBtnNext=getByClass(oDiv,'next')[0];

var oBtnMarkLeft=getByClass(oDiv,'mark_left')[0];
var oBtnMarkRight=getByClass(oDiv,'mark_right')[0];

var oDivSmall=getByClass(oDiv,'small_pic')[0];
var oUlSmall=oDivSmall.getElementsByTagName('ul')[0];
var aLiSmall=oDivSmall.getElementsByTagName('li');

var oUlBig=getByClass(oDiv,'big_pic')[0];
var aLiBig=oUlBig.getElementsByTagName('li');

var nowzindex=2;
var now=0;
oUlSmall.style.width=aLiSmall.length*aLiSmall[0].offsetWidth+'px';

oBtnPrev.onmouseover=oBtnMarkLeft.onmouseover=function(){
startMove(oBtnPrev,'opacity',100);
}
oBtnNext.onmouseover=oBtnMarkRight.onmouseover=function(){
startMove(oBtnNext,'opacity',100);
}
oBtnPrev.onmouseout=oBtnMarkLeft.onmouseout=function(){
startMove(oBtnPrev,'opacity',0);
}
oBtnNext.onmouseout=oBtnMarkRight.onmouseout=function(){
startMove(oBtnNext,'opacity',0);
}

for(var i=0;i<aLiSmall.length;i++){
aLiSmall[i].index=i;

aLiSmall[i].onclick=function(){
if(this.index==now) return;
now=this.index;
tab();
}
aLiSmall[i].onmouseover=function(){
startMove(this,'opacity',100)
}

aLiSmall[i].onmouseout=function(){
if(this.index!=now){
startMove(this,'opacity',60)
}
}

}

oBtnPrev.onclick=function(){
now--;
if(now==-1){
now=aLiSmall.length-1;
}
tab();
}
oBtnNext.onclick=function(){
now++;
if(now==aLiSmall.length){
now=0;
}
tab();
}
function tab(){
aLiBig[now].style.zIndex=nowzindex++;
/*aLiBig[this.index].style.height=0;
startMove(aLiBig[this.index],'height',320);*/

for(var i=0;i<aLiSmall.length;i++){

startMove(aLiSmall[i],'opacity',60)

}
startMove(aLiSmall[now],'opacity',100);

if(now==0){
startMove(oUlSmall,'left',0)
}else if(now==aLiSmall.length-1){
startMove(oUlSmall,'left',-(now-2)*aLiSmall[0].offsetWidth);
}

else
{
startMove(oUlSmall,'left',-(now-1)*aLiSmall[0].offsetWidth);
}
}
}

function getStyle(obj,name){

if(obj.currentstyle){
return obj.currentStyle[name];
}else{
return getComputedStyle(obj,false)[name];
}
};

function startMove(obj,attr,iTarget){

clearInterval(obj.timer);
obj.timer=setInterval(function(){
var cur=0;
if(attr=='opacity'){
cur=Math.round(parseFloat(getStyle(obj,attr))*100);
}else{
cur=parseInt(getStyle(obj,attr));
}
var speed=(iTarget-cur)/6;
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if(cur==iTarget){
clearInterval(obj.timer);
}else
{
if(attr='opacity'){
obj.style.filter='alpha(opacity:'+(speed+cur)+')';
obj.style.opacity=(cur+speed)/100;
}else{
obj.style[attr]=cur+speed+'px';
}
}

},30)
}
</script>
</head>
<body>
<div id="playimages" class="play">
<ul class="big_pic">

<div class="prev"></div>
<div class="next"></div>

<div class="text">加载图片说明……</div>
<div class="length">计算图片数量……</div>

<a class="mark_left" href="javascript:;"></a>
<a class="mark_right" href="javascript:;"></a>
<div class="bg"></div>

<li style="z-index:1;"><img src="../img/1.jpg" /></li>
<li><img src="../img/2.jpg" /></li>
<li><img src="../img/3.jpg" /></li>
<li><img src="../img/4.jpg" /></li>
<li><img src="../img/5.jpg" /></li>
<li><img src="../img/6.jpg" /></li>
</ul>
<div class="small_pic">
<ul style="width:390px;">
<li style="filter: 100; opacity: 1;"><img src="../img/1.jpg" /></li>
<li><img src="../img/2.jpg" /></li>
<li><img src="../img/3.jpg" /></li>
<li><img src="../img/4.jpg" /></li>
<li><img src="../img/5.jpg" /></li>
<li><img src="../img/6.jpg" /></li>
</ul>
</div>
</div>

</body>
</html>