Tab鼠标经过事件按钮代码
Hhtl
1
<div id="sujingnan">
2
<ul id="nav-table">
3
<li>
4
<A onmouseover="tabWinMouseOver('tabWin',1,this);" class="tabWin_Content1" href="#" id="tabWin_Title1">
5
经典案例</A>
6
</li>
7
<li>
8
<a onMouseOver="tabWinMouseOver('tabWin',2,this);" class="tabWin_Content2" href="#" id="tabWin_Title2">
9
网站功能</a>
10
</li>
11
<li>
12
<a onMouseOver="tabWinMouseOver('tabWin',3,this);" class="tabWin_Content2" href="#" id="tabWin_Title3">
13
解决方案</a>
14
</li>
15
16
17
</ul>
18
19
</div>
20
<div id="tab1"><iframe src="http://localhost/fangyinan/iframe/leftright.htm" frameBorder="0" width="99%" scrolling="no" height="150"></iframe></div>
21
<div id="tab2"><iframe src="http://localhost/fangyinan/iframe/gongneng.html" frameBorder="0" width="99%" scrolling="no" height="100%"></iframe></div>
22
<div id="tab3">33333</div>
23![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/None.gif)
4
![](/Images/OutliningIndicators/None.gif)
5
![](/Images/OutliningIndicators/None.gif)
6
![](/Images/OutliningIndicators/None.gif)
7
![](/Images/OutliningIndicators/None.gif)
8
![](/Images/OutliningIndicators/None.gif)
9
![](/Images/OutliningIndicators/None.gif)
10
![](/Images/OutliningIndicators/None.gif)
11
![](/Images/OutliningIndicators/None.gif)
12
![](/Images/OutliningIndicators/None.gif)
13
![](/Images/OutliningIndicators/None.gif)
14
![](/Images/OutliningIndicators/None.gif)
15
![](/Images/OutliningIndicators/None.gif)
16
![](/Images/OutliningIndicators/None.gif)
17
![](/Images/OutliningIndicators/None.gif)
18
![](/Images/OutliningIndicators/None.gif)
19
![](/Images/OutliningIndicators/None.gif)
20
![](/Images/OutliningIndicators/None.gif)
21
![](/Images/OutliningIndicators/None.gif)
22
![](/Images/OutliningIndicators/None.gif)
23
![](/Images/OutliningIndicators/None.gif)
CSS
1![](/Images/OutliningIndicators/None.gif)
2![](/Images/OutliningIndicators/None.gif)
3![](/Images/OutliningIndicators/None.gif)
4
#nav-table
5
{
6
7
margin-top:3px;
8
list-style:none;
9
border:0px solid #000;
10
width:870px;
11
margin-left:0px;
12
float:left;
13
14
}
15
16
#nav-table li{
17
float:left;
18
margin-bottom:0px;
19
border-bottom:0px solid #000000;
20![](/Images/OutliningIndicators/InBlock.gif)
21![](/Images/OutliningIndicators/InBlock.gif)
22
}
23![](/Images/OutliningIndicators/None.gif)
24
#nav-table li a{
25![](/Images/OutliningIndicators/InBlock.gif)
26
text-decoration:none;
27
display:block;
28
width:94px;
29
height:27px;
30![](/Images/OutliningIndicators/InBlock.gif)
31
font-size:12px;
32
margin-left:0px;
33
padding-top:8px;
34
padding-left:18px;
35![](/Images/OutliningIndicators/InBlock.gif)
36
}
37![](/Images/OutliningIndicators/None.gif)
38
#sujingnan
39
{
40
width:100%;
41
border:0px solid #009933;}
42![](/Images/OutliningIndicators/None.gif)
43
#tab1
44
{
45
float:left;
46
height:151px;
47
48
border:1px solid #A7B9BD;
49
margin-top:0px;
50
padding-top:0px;
51
text-align:center;
52
}
53
#tab2
54
{
55
border-left:1px solid #cce4f0;
56
border:1px solid #A7B9BD;
57
height:151px;
58
display:none;
59
60
}
61
#tab3
62
{
63
border-left:1px solid #cce4f0;
64
border:1px solid #A7B9BD;
65
height:151px;
66
display:none;
67
68
}
69
.tabWin_Content2
70
{
71
font-size: 12px;
72
font-weight: bold;
73
color: #006699;
74
background-image: url(/sysmod/webmod10000002/images/change3.jpg);
75![](/Images/OutliningIndicators/InBlock.gif)
76
}
77![](/Images/OutliningIndicators/None.gif)
78
.tabWin_Content1
79
{
80
81
font-size: 12px;
82
font-weight: bold;
83
color: #006699;
84
background-image: url(/sysmod/webmod10000002/images/change4.jpg);
85
}
86![](/Images/OutliningIndicators/None.gif)
87![](/Images/OutliningIndicators/None.gif)
88![](/Images/OutliningIndicators/None.gif)
89![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/None.gif)
4
![](/Images/OutliningIndicators/None.gif)
5
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
6
![](/Images/OutliningIndicators/InBlock.gif)
7
![](/Images/OutliningIndicators/InBlock.gif)
8
![](/Images/OutliningIndicators/InBlock.gif)
9
![](/Images/OutliningIndicators/InBlock.gif)
10
![](/Images/OutliningIndicators/InBlock.gif)
11
![](/Images/OutliningIndicators/InBlock.gif)
12
![](/Images/OutliningIndicators/InBlock.gif)
13
![](/Images/OutliningIndicators/InBlock.gif)
14
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
15
![](/Images/OutliningIndicators/None.gif)
16
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
17
![](/Images/OutliningIndicators/InBlock.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/InBlock.gif)
20
![](/Images/OutliningIndicators/InBlock.gif)
21
![](/Images/OutliningIndicators/InBlock.gif)
22
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
23
![](/Images/OutliningIndicators/None.gif)
24
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
25
![](/Images/OutliningIndicators/InBlock.gif)
26
![](/Images/OutliningIndicators/InBlock.gif)
27
![](/Images/OutliningIndicators/InBlock.gif)
28
![](/Images/OutliningIndicators/InBlock.gif)
29
![](/Images/OutliningIndicators/InBlock.gif)
30
![](/Images/OutliningIndicators/InBlock.gif)
31
![](/Images/OutliningIndicators/InBlock.gif)
32
![](/Images/OutliningIndicators/InBlock.gif)
33
![](/Images/OutliningIndicators/InBlock.gif)
34
![](/Images/OutliningIndicators/InBlock.gif)
35
![](/Images/OutliningIndicators/InBlock.gif)
36
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
37
![](/Images/OutliningIndicators/None.gif)
38
![](/Images/OutliningIndicators/None.gif)
39
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
40
![](/Images/OutliningIndicators/InBlock.gif)
41
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
42
![](/Images/OutliningIndicators/None.gif)
43
![](/Images/OutliningIndicators/None.gif)
44
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
45
![](/Images/OutliningIndicators/InBlock.gif)
46
![](/Images/OutliningIndicators/InBlock.gif)
47
![](/Images/OutliningIndicators/InBlock.gif)
48
![](/Images/OutliningIndicators/InBlock.gif)
49
![](/Images/OutliningIndicators/InBlock.gif)
50
![](/Images/OutliningIndicators/InBlock.gif)
51
![](/Images/OutliningIndicators/InBlock.gif)
52
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
53
![](/Images/OutliningIndicators/None.gif)
54
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
55
![](/Images/OutliningIndicators/InBlock.gif)
56
![](/Images/OutliningIndicators/InBlock.gif)
57
![](/Images/OutliningIndicators/InBlock.gif)
58
![](/Images/OutliningIndicators/InBlock.gif)
59
![](/Images/OutliningIndicators/InBlock.gif)
60
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
61
![](/Images/OutliningIndicators/None.gif)
62
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
63
![](/Images/OutliningIndicators/InBlock.gif)
64
![](/Images/OutliningIndicators/InBlock.gif)
65
![](/Images/OutliningIndicators/InBlock.gif)
66
![](/Images/OutliningIndicators/InBlock.gif)
67
![](/Images/OutliningIndicators/InBlock.gif)
68
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
69
![](/Images/OutliningIndicators/None.gif)
70
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
71
![](/Images/OutliningIndicators/InBlock.gif)
72
![](/Images/OutliningIndicators/InBlock.gif)
73
![](/Images/OutliningIndicators/InBlock.gif)
74
![](/Images/OutliningIndicators/InBlock.gif)
75
![](/Images/OutliningIndicators/InBlock.gif)
76
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
77
![](/Images/OutliningIndicators/None.gif)
78
![](/Images/OutliningIndicators/None.gif)
79
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
80
![](/Images/OutliningIndicators/InBlock.gif)
81
![](/Images/OutliningIndicators/InBlock.gif)
82
![](/Images/OutliningIndicators/InBlock.gif)
83
![](/Images/OutliningIndicators/InBlock.gif)
84
![](/Images/OutliningIndicators/InBlock.gif)
85
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
86
![](/Images/OutliningIndicators/None.gif)
87
![](/Images/OutliningIndicators/None.gif)
88
![](/Images/OutliningIndicators/None.gif)
89
![](/Images/OutliningIndicators/None.gif)
js
1![](/Images/OutliningIndicators/None.gif)
2
function tabWinMouseOver(tabWinObj,tabWinTotal,obj)
3
{
4![](/Images/OutliningIndicators/InBlock.gif)
5
if(tabWinTotal==1)
6
{
7
8
document.getElementById("tab1").style.display="block";
9
document.getElementById("tab2").style.display="none";
10
document.getElementById("tab3").style.display="none";
11
document.getElementById("tabWin_Title1").className="tabWin_Content1";
12
document.getElementById("tabWin_Title2").className="tabWin_Content2";
13
document.getElementById("tabWin_Title3").className="tabWin_Content2";
14
15
}
16
else if(tabWinTotal==2)
17
{
18
document.getElementById("tab1").style.display="none";
19
document.getElementById("tab2").style.display="block";
20
document.getElementById("tab3").style.display="none";
21
document.getElementById("tabWin_Title1").className="tabWin_Content2";
22
document.getElementById("tabWin_Title2").className="tabWin_Content1";
23
24
document.getElementById("tabWin_Title3").className="tabWin_Content2";
25
26
}
27
else if(tabWinTotal==3)
28
{
29
document.getElementById("tab1").style.display="none";
30
document.getElementById("tab2").style.display="none";
31
document.getElementById("tab3").style.display="block";
32
document.getElementById("tabWin_Title1").className="tabWin_Content2";
33
document.getElementById("tabWin_Title2").className="tabWin_Content2";
34
document.getElementById("tabWin_Title3").className="tabWin_Content1";
35
36
37
}
38
}
39![](/Images/OutliningIndicators/None.gif)
![](/Images/OutliningIndicators/None.gif)
2
![](/Images/OutliningIndicators/None.gif)
3
![](/Images/OutliningIndicators/ExpandedBlockStart.gif)
4
![](/Images/OutliningIndicators/InBlock.gif)
5
![](/Images/OutliningIndicators/InBlock.gif)
6
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
7
![](/Images/OutliningIndicators/InBlock.gif)
8
![](/Images/OutliningIndicators/InBlock.gif)
9
![](/Images/OutliningIndicators/InBlock.gif)
10
![](/Images/OutliningIndicators/InBlock.gif)
11
![](/Images/OutliningIndicators/InBlock.gif)
12
![](/Images/OutliningIndicators/InBlock.gif)
13
![](/Images/OutliningIndicators/InBlock.gif)
14
![](/Images/OutliningIndicators/InBlock.gif)
15
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
16
![](/Images/OutliningIndicators/InBlock.gif)
17
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
18
![](/Images/OutliningIndicators/InBlock.gif)
19
![](/Images/OutliningIndicators/InBlock.gif)
20
![](/Images/OutliningIndicators/InBlock.gif)
21
![](/Images/OutliningIndicators/InBlock.gif)
22
![](/Images/OutliningIndicators/InBlock.gif)
23
![](/Images/OutliningIndicators/InBlock.gif)
24
![](/Images/OutliningIndicators/InBlock.gif)
25
![](/Images/OutliningIndicators/InBlock.gif)
26
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
27
![](/Images/OutliningIndicators/InBlock.gif)
28
![](/Images/OutliningIndicators/ExpandedSubBlockStart.gif)
29
![](/Images/OutliningIndicators/InBlock.gif)
30
![](/Images/OutliningIndicators/InBlock.gif)
31
![](/Images/OutliningIndicators/InBlock.gif)
32
![](/Images/OutliningIndicators/InBlock.gif)
33
![](/Images/OutliningIndicators/InBlock.gif)
34
![](/Images/OutliningIndicators/InBlock.gif)
35
![](/Images/OutliningIndicators/InBlock.gif)
36
![](/Images/OutliningIndicators/InBlock.gif)
37
![](/Images/OutliningIndicators/ExpandedSubBlockEnd.gif)
38
![](/Images/OutliningIndicators/ExpandedBlockEnd.gif)
39
![](/Images/OutliningIndicators/None.gif)