当前位置:首页 > 网页特效 > 焦点图 >

js淘宝幻灯片上下滑动效果

时间:2014-06-27 08:33 来源:互联网 作者:源码搜藏 收藏 推荐

  • 广告推荐
效果预览 立即下载

js淘宝幻灯片上下滑动效果js淘宝幻灯片上下滑动效果是一款原生态纯js仿淘宝幻灯片轮播切换效果代码。js上下滑动数字按钮自动切换 所属专题:幻灯片代码


<script src="js/move.js" type="text/javascript"></script>
<script type="text/javascript">
window.onload=function(){
var oDiv=document.getElementById("div1");
var aBtn=oDiv.getElementsByTagName("ol")[0].getElementsByTagName("li");
var oUl=oDiv.getElementsByTagName("ul")[0];
var now=0;
for(var i=0;i<aBtn.length;i++){
aBtn[i].index=i;
aBtn[i].onclick=function(){
now=this.index
tab();
}
}
function tab(){
for(var j=0;j<aBtn.length;j++){
aBtn[j].className="";
}
aBtn[now].className='actived';
move(oUl,{top:-360*now});
}
function next(){
now++;
if(now==aBtn.length){
now=0;
}
tab();
}
var timer=setInterval(next,5000);
oDiv.onmouseover=function(){
clearInterval(timer);
};
oDiv.onmouseout=function(){
timer=setInterval(next,5000)
}
}
</script>

本站资源仅限于学习研究,严禁从事商业或者非法活动! 源码搜藏网所有源码来自互联网转载与用户上传分享,如果侵犯了您的权益请与我们联系,我们将在24小时内删除!谢谢!

焦点图下载排行

最新文章