JQuery 选项卡参考 样式及代码说明

.tabs { //ulheight: 32px;border-bottom: 1px solid #999;border-left: 1px solid #999;width: 100%;}.tabs li { //ul liheight: 31px;line-height: 31px;float: left;border: 1px solid #999;border-left: none;margin-bottom: -1px; //针对ul外边框向上移动1像素background: #e0e0e0;}.tabs li:hover{background:#fff;border-bottom:1px solid #fff;}JQuery 代码

index() //获取当前选中的索引

siblings() //对同级做响应的处理

eq() //找到与其相等的索引 执行操作

$(this).addClass("whitebg").siblings().removeClass("whitebg");$(".tabbox").hide().eq(liIdx).show();