毕业设计专卖
出售各类计算机毕业设计、课程设计，量大从优，咨询QQ：285865061
仿yahoo导航菜单效果
1
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
2
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
3
<
head
>
4
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=gb2312"
/>
5
<
meta
http-equiv
="PRAGMA"
content
="NO-CACHE"
/>
6
<
title
>
雅虎导航效果
</
title
>
7
<
style
type
="text/css"
>
8
body
{
}
{
margin
:
0
;
text-align
:
center
;
font-size
:
12px
;
}
9
.papanel,#pabd,.paft,#patop
{
}
{
width
:
348px
;
}
10
.papanel
{
}
{
background
:
#a5d0fd url(images/pabg.gif) repeat-x
;
border-left
:
1px solid #7bbdff
;
border-right
:
1px solid #7bbdff
;
font-family
:
arial
;
}
11
#pabd
{
}
{
padding-bottom
:
.35em
;
background
:
url(images/patbg.gif) no-repeat top left
;
}
12
#pabd,.paft
{
}
{
clear
:
both
;
overflow
:
hidden
;
}
13
#patop
{
}
{
height
:
25px
;
line-height
:
20px
;
overflow
:
hidden
;
}
14
/**/
/*
顶部圆角开始
*/
15
.pabdt
{
}
{
background
:
url(images/pabdr.gif) 0 0 no-repeat
;
width
:
350px
;
height
:
4px
;
overflow
:
hidden
;
}
16
.pabdb
{
}
{
background
:
url(images/pabdr.gif) 0 -4px no-repeat
;
width
:
350px
;
height
:
3px
;
overflow
:
hidden
;
}
17
.paft
{
}
{
height
:
4px
;
line-height
:
0
;
}
18
/**/
/*
顶部圆角结束
*/
19
.patabs
{
}
{
width
:
340px
;
margin
:
0 auto
;
}
20
.patabslst
{
}
{
margin
:
.25em 0 0 0
;
padding
:
0
;
list-style
:
none
;
height
:
40px
;
}
21
.patabslst li
{
}
{
float
:
left
;
position
:
relative
;
width
:
112px
;
height
:
40px
;
line-height
:
40px
;
text-align
:
center
;
}
22
.patabslst li a
{
}
{
display
:
block
;
width
:
109px
;
height
:
40px
;
}
23
/**/
/*
内置背景开始
*/
24
.papreviewdiv
{
}
{
position
:
relative
;
clear
:
both
;
width
:
338px
;
_width
/**/
/*
*/
:
340px
;
margin
:
0 auto
;
background
:
#fff
;
border-left
:
1px solid #85c3ff
;
border-right
:
1px solid #5ca3e9
;
display
:
none
;
}
25
/**/
/*
外部小图标开始
*/
26
.icomailn
{
}
{
background
:
url(images/tabicmln.gif) 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/tabicmln.gif", sizingMethod='crop')
;
}
27
.icomail
{
}
{
background
:
url(images/tabicml.gif) 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/tabicml.gif", sizingMethod='crop')
;
}
28
.icoalb
{
}
{
background
:
url(images/tabicalb.gif) 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/tabicalb.gif", sizingMethod='crop')
;
}
29
.icomus
{
}
{
background
:
url(images/tabicmus.gif) 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/tabicmus.gif", sizingMethod='crop')
;
}
30
.icofin
{
}
{
background
:
url(images/tabicfin.gif) 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/tabicfin.gif", sizingMethod='crop')
;
}
31
.icoalqq
{
}
{
background
:
url("images/3.gif") 0 0 no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/3.gif", sizingMethod='crop')
;
}
32
/**/
/*
内置图标开始
*/
33
.pamailcon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 2em 2em no-repeat
;
padding
:
1.5em 0 0 10em
;
}
34
.pamailcon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
35
.pasmscon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 1em 1.5em no-repeat
;
padding
:
1.5em 0 0 8em
;
}
36
.pasmscon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
37
.paemailcon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 1em 1.5em no-repeat
;
padding
:
1.5em 0 0 8em
;
}
38
.paemailcon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
39
.paqqcon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 1em 1.5em no-repeat
;
padding
:
1.5em 0 0 8em
;
;
}
40
.paqqcon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
41
.pafaxcon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 1em 1.5em no-repeat
;
padding
:
1.5em 0 0 8em
;
;
}
42
.pafaxcon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
43
.patxcon,.pamywebcon
{
}
{
float
:
left
;
text-align
:
left
;
line-height
:
1.5em
;
background
:
url(images/icmla.gif) 1em 1.5em no-repeat
;
padding
:
1.5em 0 0 8em
;
;
}
44
.patxcon strong,.pamywebcon strong
{
}
{
color
:
#ff0000
;
}
45
/**/
/*
背景开始
*/
46
.patabs2,.patabs1
{
}
{
background
:
url(images/patabs1.gif) no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/patabs1.gif", sizingMethod='crop')
;
}
47
.patabs1_pamail,.patabs2_paweath
{
}
{
background
:
url(images/patabsa.gif) no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/patabsa.gif", sizingMethod='crop')
;
}
48
.patabs1_paalb,.patabs2_pafin
{
}
{
background
:
url(images/patabsb.gif) no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/patabsb.gif", sizingMethod='crop')
;
}
49
.patabs1_pamus,.patabs2_pamyw
{
}
{
background
:
url(images/patabsc.gif) no-repeat
;
*background
:
transparent
;
*filter
:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src="images/patabsc.gif", sizingMethod='crop')
;
}
50
#patabs1 strong,#patabs2 strong
{
}
{
color
:
#0062c5
;
font-size
:
13px
;
margin-left
:
2em
;
}
51
#patabs1 a,#patabs2 a
{
}
{
text-decoration
:
none
;
}
52
</
style
>
53
<
script
type
="text/javascript"
>
54
ycn
=
window.ycnui
||
{}
;
55
ycn.Common
=
new
function
()
{
this
.lTrim
=
function
(i)
{
return
i.replace(
/
^\s*
/
,
""
);}
;
this
.rTrim
=
function
(i)
{
return
i.replace(
/
\s*$
/
,
""
);}
;
this
.trim
=
function
(i)
{
return
this
.rTrim(
this
.lTrim(i));}
;
this
.getEl
=
function
(i)
{
if
(
!
document.getElementById)
return
false
;
if
(
typeof
i
===
"
string
"
)
{
return
document.getElementById(i);}
else
{
return
i;}
}
;
this
.getElByClassName
=
function
(t,n,s,el)
{
var
el
=
(el)
?
el:document;
var
itm
=
el.getElementsByTagName(t);
var
num
=
1
;
for
(i
=
0
;i
<
itm.length;i
++
)
{
if
(itm[i].className
===
n
&&
s
===
num)
{
return
itm[i];}
else
if
(itm[i].className
===
n)
{num
++
;}
}
56
return
false
;}
;
57
this
.isIE6
=
function
()
{
return
navigator.userAgent.search(
'
MSIE
'
)
>
0