html轮播图片不显示不了,图片轮播的奇怪现象【图片显示不完整】
测试轮播
functiongetByClass(className,context){
context=context ||document;if(context.getElementsByClassName){returncontext.getElementsByClassName(className);
}var nodes=context.getElementsByClassName(‘*‘),
ret=[];for(var i=0;i
}returnret;
}functionhasClass(node,className){var names=node.className.split(/\s+/);for(var i=0;i
}return false;
}//下面是动画函数
/*参数说明
curTime:当前时间,即动画已经进行了多长时间,开始时间为0.
start:开始值。
dur:动画持续多长时间
alter:总的变化量*/
functionanimate(o,start,alter,dur,fx){var curTime=0;var t=setInterval(function(){if (curTime>=dur) clearTime(t);for(var i instart){
o.style[i]=fx(start[i],alter[i],curTime,dur)+”px”;
}
curTime+=50;
},50);
}functionLinear(start,alter,curTime,dur) {return start+curTime/dur*alter;
}//最简单的线性变化,也就是匀速运动
functionQuad (start,alter,curTime,dur) {return start+Math.pow(curTime/dur,2)*alter;
}//动画结束
(function(i){
btns[i].οnmοuseοver=function(){
clearTimeout(t);//scrollContent.style.top=(-i*260)+”px”;
var top=parseInt(scrollContent.style.top) || 0;
animate(scrollContent,{top:top},{top:(-i*260)-top},400,Quad)for(var j=0;j
btns[j].className=””;
}this.className=”hover”;
cur=this;
};
btns[i].οnmοuseοut=function(){
t=setTimeout(fn,2000);
}//移开鼠标
btns[i].index=i;
})(i);
}
btns[0].onmouseover();//对第一个执行动作
t=setTimeout(fn,2000); //停留2秒
functionfn(){var nextIndex=cur.index+1;if(nextIndex==btns.length){
nextIndex=0;
}
btns[nextIndex].onmouseover();
t=setTimeout(fn,2000);
}
};
![第1张][1]
![第2张][1]
![第3张][1]
![第4张][1]
![第5张][1]
- 1
- 2
- 3
- 4
- 5
[1]:
还没有评论,来说两句吧...