Tab选项卡切换效果_技术问答

首页免费课 Tab选项卡切换效果问答

Tab选项卡切换效果

                
                Amy
            
                    查看讲师更多课程 
                    Amy讲师的其他课程
                
CSS3实现漂亮ToolTips效果
初级·42722
免费课程
                                
css3实现网页平滑过渡效果
初级·54370
免费课程
                                
CSS3实现“图片阴影”效果
初级·34770
免费课程
                                
DOM事件探秘
中级·99546
免费课程
                                
瀑布流布局
初级·97755
免费课程
                                
                难度初级
            
                时长 1小时34分
            
                学习人数
            
综合评分9.73
                            233人评价
                        查看评价
                                9.9
                                内容实用
                            
                                9.8
                                简洁易懂
                            
                                9.5
                                逻辑清晰

全部评论问答未解决精华

赢天下

刚才的发错了。 function dochange(curindex){
for(var i=0;i<list.length;i++){
list[i].className="";
}
list[curindex].className="on";
h=-170*curindex;
pic.style.top=h+"px";
index=curindex;
}
}

0 4-1 焦点轮播图效果

2015-09-15

赢天下

0 4-1 焦点轮播图效果

2015-09-15

赢天下

function autoplay(){
index++
if(index>=list.length){
index=0;
}
dochange(index);
}

0 4-1 焦点轮播图效果

2015-09-15

赢天下

for(var i=0;i<list.length;i++){
list[i].id=i;
list[i].onmouseover=function(){
clearInterval(timer);
dochange(this.id);
}
list[i].onmouseout=function(){
timer=setInterval(autoplay,1000);
}
}
if(timer){
clearInterval(timer);
}
timer=setInterval(autoplay,1000);

0 4-1 焦点轮播图效果

2015-09-15

赢天下

window.onload=function(){
var wrap=document.getElementById('wrap'),
pic=document.getElementById('pic'),
list=document.getElementById('list').getElementsByTagName('li'),
index=0,
h=0;
timer=null;

0 4-1 焦点轮播图效果

2015-09-15

赢天下

send.onclick=function(){
send.value=times+"秒后重试";
send.disabled="false";
timer=setInterval(js,1000);
}
function js(){
if(times>1){
times-=1;
send.value=times+"秒后重试";
}else{
send.value="发送验证码";
send.disabled="";
clearInterval(timer);
}
}

0 3-4 编程练习

2015-09-15