本文演示了Javascript的示例代码,实现一个简单的tab
选项卡开关,供您
参考。
详情如下
设计素描 uff1a
具体的代码:
表开关
* {
衬垫:
}
按钮{
宽度:95px;
}
{活动。
背景颜色:黄色;
}
#包{
宽度:510px;
溢出:隐藏;
保证金:0汽车;
}
#内{
宽度:9999px;
溢出:隐藏;
职位:相对;
左:0;
过渡:左0.6s;
}
#内{
浮点数:左;
}
#内{ IMG
显示块;
宽度:510px;
}
#主要{
文本对齐:中心;
}
一
二
三
四
五
获取节点
无功btnlist = document.getelementsbytagname(按钮);
基于VaR的内部= document.getelementbyid(内);
可见宽度
无功perwidth =内。孩子{ 0 }。offsetwidth;
添加事件
对于(var i = 0;i < btnlist.length;i++){
我btnlist { }。指数=我;
我btnlist { }。onclick =
函数(){
inner.style.left = - perwidth * this.index +PX;
对于(var j = 0;J < btnlist.length;j++){
btnlist {,}。类名= ;
}
this.classname =活跃;
}
}
希望本文能帮助您
学习Javascript
程序设计并掌握
选项卡的切换
操作。