<强> 1。鼠标移入移出切换
& lt; !DOCTYPE html>
& lt; html lang=癳n”比;
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title>选项卡切换& lt;/title>
& lt;风格类型=" text/css "比;
*{填充:0;保证金:0;}
李{list-style:没有;}
.wrapper {
保证金:0汽车;
宽度:100%;
max-width: 1140 px;
}
.tabbox {
保证金:40 px汽车;
宽度:400 px;
身高:200 px;
边界:1 px固体# f70;
溢出:隐藏;
}
.tabbox .tab-tit {
位置:相对;
高度:40像素;
}
ul {
位置:绝对的;
左:1 px;
宽度:401 px;
高度:40像素;
行高:40像素;
background - color: # eaeaea;
}
ul李{
浮:左;
border-left: 1 px固体# f70;
边界底部:1 px固体# f70;
text-align:中心;
宽度:99 px;
高度:40像素;
溢出:隐藏;
}
.clear{明确:;}
.select {
padding-right: 1 px;
边界底部:没有;
background - color: # fff;
}
:链接时,答:访问{
字体大小:16 px;
粗细:大胆的;
颜色:# 888;
文字修饰:没有;
}
.select一个{
颜色:# 333;
}
盘旋,答:活跃的{
颜色:# f20;
粗细:大胆的;
}
.tab-txt {
宽度:400 px;
填充:40像素;
溢出:隐藏;
}
.demo{显示:没有;}
.tab-txt p {
行高:40像素;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div类=鞍捌鳌北?
& lt; div id=皌abBox”class=皌abBox”比;
& lt; div id=皌abTit”class=皌ab-tit”比;
& lt; ul>
& lt;李类="选择"祝辞& lt; a href=" javascript:,“在女枪& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在提莫& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在盖伦& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在剑圣& lt;/a> & lt;/li>
& lt;/ul>
& lt;/div>
& lt; !类——& lt; div=懊魅贰弊４? lt;/div>——比;
& lt; div id=皌abTxt”class=皌ab-txt”比;
& lt; div类=把菔尽北?
& lt; p>我有两把枪,一把叫射,另一把叫,啊~ & lt;/p>
& lt; p>你有一双迷人的眼睛,我非常喜欢! & lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>我去前面探探路& lt;/p>
& lt; p>提莫队长正在待命! & lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>放马过来吧,你会死的很光荣的! & lt;/p>
& lt; p>快点儿结束吧,我头有点儿转晕了……& lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>我的剑就是你的剑。;/p>
& lt; p>眼睛多,看东西才会更加清楚& lt;/p>
& lt;/div>
& lt;/div>
& lt;/div>
& lt;/div>
& lt;脚本type=" text/javascript祝辞
函数$ (id) {
返回typeof id==="字符串" & # 63;. getelementbyid (id):身份证;
}
窗口。onload=function () {
var山雀=$ (“tabTit”) .getElementsByTagName(“李”);
var txt=$ (“tabTxt”) .getElementsByClassName(“演示”);
如果(山雀。长度!=txts.length){返回;}
(var=0, l=tits.length;i
& lt;/body>
& lt;/html>
之前
<强> 2。鼠标移入移出延时切换
& lt; !DOCTYPE html>
& lt; html lang=癳n”比;
& lt; head>
& lt;元charset=皍tf - 8”比;
& lt; title>选项卡切换之延时切换& lt;/title>
& lt;风格类型=" text/css "比;
*{填充:0;保证金:0;}
李{list-style:没有;}
.wrapper {
保证金:0汽车;
宽度:100%;
max-width: 1140 px;
}
.tabbox {
保证金:40 px汽车;
宽度:400 px;
身高:200 px;
边界:1 px固体# f70;
溢出:隐藏;
}
.tabbox .tab-tit {
位置:相对;
高度:40像素;
}
ul {
位置:绝对的;
左:1 px;
宽度:401 px;
高度:40像素;
行高:40像素;
background - color: # eaeaea;
}
ul李{
浮:左;
border-left: 1 px固体# f70;
边界底部:1 px固体# f70;
text-align:中心;
宽度:99 px;
高度:40像素;
溢出:隐藏;
}
.clear{明确:;}
.select {
padding-right: 1 px;
边界底部:没有;
background - color: # fff;
}
:链接时,答:访问{
字体大小:16 px;
粗细:大胆的;
颜色:# 888;
文字修饰:没有;
}
.select一个{
颜色:# 333;
}
盘旋,答:活跃的{
颜色:# f20;
粗细:大胆的;
}
.tab-txt {
宽度:400 px;
填充:40像素;
溢出:隐藏;
}
.demo{显示:没有;}
.tab-txt p {
行高:40像素;
}
& lt;/style>
& lt;/head>
& lt; body>
& lt; div类=鞍捌鳌北?
& lt; div id=皌abBox”class=皌abBox”比;
& lt; div id=皌abTit”class=皌ab-tit”比;
& lt; ul>
& lt;李类="选择"祝辞& lt; a href=" javascript:,“在女枪& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在提莫& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在盖伦& lt;/a> & lt;/li>
& lt; li> & lt; a href=" javascript:,“在剑圣& lt;/a> & lt;/li>
& lt;/ul>
& lt;/div>
& lt; !类——& lt; div=懊魅贰弊４? lt;/div>——比;
& lt; div id=皌abTxt”class=皌ab-txt”比;
& lt; div类=把菔尽北?
& lt; p>我有两把枪,一把叫射,另一把叫,啊~ & lt;/p>
& lt; p>你有一双迷人的眼睛,我非常喜欢! & lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>我去前面探探路& lt;/p>
& lt; p>提莫队长正在待命! & lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>放马过来吧,你会死的很光荣的! & lt;/p>
& lt; p>快点儿结束吧,我头有点儿转晕了……& lt;/p>
& lt;/div>
& lt; div类=把菔尽北?
& lt; p>我的剑就是你的剑。;/p>
& lt; p>眼睛多,看东西才会更加清楚& lt;/p>
& lt;/div>
& lt;/div>
& lt;/div>
& lt;/div>
& lt;脚本type=" text/javascript祝辞
函数$ (id) {
返回typeof id==="字符串" & # 63;. getelementbyid (id):身份证;
}
窗口。onload=function () {
var计时器=零;
var山雀=$ (“tabTit”) .getElementsByTagName(“李”);
var txt=$ (“tabTxt”) .getElementsByClassName(“演示”);
如果(山雀。长度!=txts.length){返回;}
(var=0, l=tits.length;i
