jQuery网页标签特效的简单实现

jQuery网页标签特效的简单实现
CSS:

复制代码代码如下所示:

。明确{明确:两;高度:0px;溢出:隐藏;}

。标签{宽度:400px;字体大小:12px;}

。tab_menu UL { padding: 0px;保证金:0px;}

。tab_menu李{列表样式:无;显示:块;浮动:左;

背景:# c2cefe;身高:22px;线高度:22px;

填料:0px 8px;右边距:6px;边界:# 86b4ca 1px solid;

}

。箱{宽度:400px;高度:200px;溢出:隐藏;边界:# a8c9d9 1px solid;填充:10px 8px;}

。tab_menu ul。选择{背景:#哒哒哒;鼠标指针;}

隐藏{显示:无;}
jQuery:

复制代码代码如下所示:

$(函数(){())

menu_li = $(var $ div.tab_menu UL Li ); / / 选项卡中选择

menu_li.click美元(函数(){()

$(这)。AddClass(选择) / /高亮当前

兄弟姐妹(RemoveClass)(选择); / /删除其他同行突出

VaR指标= menu_li.index美元($(this); / /)找到子节点索引

$(div.tab_box > div)。情商(指数)显示(N) / /指数DVI显示器

(兄弟姐妹)(隐藏);其他隐藏标签

})

})
HTML:

复制代码代码如下所示:

个人信息

我的照片

我的博客

我的QQ:123456

您好!

你好

tag:网页简单实现标签特效电脑软件

相关内容