<!
DOCTYPE?html?PUBLIC?"-//W3C//DTD?XHTML?1.0?Transitional//EN"?"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html?
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
meta?
http-equiv
="Content-Type"
?content
="text/html;?charset=utf-8"
?
/>
<
title
>
??
</
title
>
<
style
>
body?
{
??margin
:
?7px
;
??font
:
12px?Verdana,?Arial,?Helvetica,?sans-serif
;
}
*?
{
??list-style-type
:
?none
;
??margin
:
?0px
;
??padding
:
?0px
;
??border
:
?thin?none
;
}
#nav?
{
??position
:
?absolute
;
??font-size
:
?9px
;
??opacity
:
?0.8
;
}
#nav?a?
{
??display
:
?block
;
??width
:
?100px
;
??height
:
?15px
;
??padding
:
?3px?5px?12px
;
??background
:
?#666
;
??color
:
?#fff
;
??text-decoration
:
?none
;
}
#nav?a:hover?
{
??background
:
?#333
;
}
#nav?li?
{
??width
:
?120px
;
??height
:
30px
;
??overflow
:
hidden
;
??background
:
?#ccc
;
??padding-bottom
:
?3px
;
}
#nav?ul?
{
??position
:
?absolute
;
??margin-left
:
?110px
;
??margin-top
:
?-30px
;
}
html>body?#nav?ul?
{
??margin-left
:
?119px
;
??margin-top
:
?-39px
;
}
#nav?ul?
{
??display
:
?none
;
}
#nav?li.show?ul?
{
??display
:
?block
;
}
#nav?li.show?li?ul?
{
??display
:
?none
;
}
#nav?li?li.show?ul?
{
??display
:
?block
;
}
</
style
>
<
script?
language
="javascript"
?type
="text/javascript"
>
function
?menuFix()?{
??
var
?sfEls?
=
?document.getElementById(
"
nav
"
).getElementsByTagName(
"
li
"
);
??
for
?(
var
?i
=
0
;?i
<
sfEls.length;?i
++
)?{
????sfEls[i].onmouseover
=
function
()?{
??????
this
.className
+=
(
this
.className.length
>
0
?
?
"
?
"
:?
""
)?
+
?
"
show
"
;
????}
????sfEls[i].onmouseout
=
function
()?{
??????
this
.className
=
this
.className.replace(
new
?RegExp(
"
(??|^)show\\b
"
),?
""
);
????}
??}
}
window.onload
=
menuFix;
</
script
>
</
head
>
<
body
>
<
ul?
id
="nav"
>
??
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????
<
ul
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????????
<
ul
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
</
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
</
li
>
????????
</
ul
>
??????
</
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????????
<
ul
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
????????
</
ul
>
??????
</
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????????
<
ul
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
????????
</
ul
>
??????
</
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????????
<
ul
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
????????
</
ul
>
??????
</
li
>
????
</
ul
>
??
</
li
>
??
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????
<
ul
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
????
</
ul
>
??
</
li
>
??
<
li
><
a?
href
="#"
>
nav?item
</
a
>
.
????
<
ul
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
??????
<
li
><
a?
href
="#"
>
nav?item
</
a
></
li
>
????
</
ul
>
??
</
li
>
</
ul
>
</
body
>
</
html
>
posted on 2006-12-25 17:16
kelven 閱讀(2274)
評論(0) 編輯 收藏 所屬分類:
JavaScript