复制代码代码如下:
<%@page pageencoding = "utf-8"
contentType = "text/html; charset = utf-8" %>
<html>
<head>
<title> WebForm5 </title>
<style>/ * root = แนวนอนรอง = แนวตั้ง *//
ul#navmenu-h {
มาร์จิ้น: 0;
ชายแดน: 0 ไม่มี;
Padding: 0;
ความกว้าง: 500px; /*สำหรับ khtml*/
รายการสไตล์: ไม่มี;
ความสูง: 24px;
-
ul#navmenu-h li {
มาร์จิ้น: 0;
ชายแดน: 0 ไม่มี;
Padding: 0;
ลอย: ซ้าย; /*สำหรับตุ๊กแก*/
แสดง: อินไลน์;
รายการสไตล์: ไม่มี;
ตำแหน่ง: ญาติ;
ความสูง: 24px;
-
ul#navmenu-h ul {
มาร์จิ้น: 0;
ชายแดน: 0 ไม่มี;
Padding: 0;
ความกว้าง: 160px;
รายการสไตล์: ไม่มี;
แสดง: ไม่มี;
ตำแหน่ง: สัมบูรณ์;
ด้านบน: 24px;
ซ้าย: 0;
-
ul#navmenu-h ul: หลังจาก /*จาก IE 7 ขาดการปฏิบัติตาม* /{
ชัดเจน: ทั้งสอง;
แสดง: บล็อก;
แบบอักษร: 1px/0px serif;
เนื้อหา: ".";
ความสูง: 0;
ทัศนวิสัย: ซ่อน;
-
ul#navmenu-h ul li {
ความกว้าง: 160px;
ลอย: ซ้าย; /*สำหรับ IE 7 ขาดการปฏิบัติตาม*/
แสดง: บล็อก! สำคัญ;
แสดง: อินไลน์; /*สำหรับ IE*/
-
/ * เมนูรูท *//
ul#navmenu-h a {
ชายแดน: 1px Solid #FFF;
ชายแดน-ขวาสี: #CCC;
ขอบล่าง-สี: #CCC;
Padding: 0 6px;
ลอย: ไม่มี! สำคัญ; /*สำหรับโอเปร่า*/
ลอย: ซ้าย; /*สำหรับ IE*/
แสดง: บล็อก;
ความเป็นมา: #eee;
สี: #666;
แบบอักษร: Bold 10px/22px Verdana, Arial, Helvetica, Sans-Serif;
การตกแต่งข้อความ: ไม่มี;
ความสูง: อัตโนมัติ! สำคัญ;
ความสูง: 1%; /*สำหรับ IE*/
-
/ * รูทเมนูการคงอยู่ต่อเนื่อง */
ul#navmenu-h a: โฮเวอร์
ul#navmenu-h li: โฮเวอร์ก
ul#navmenu-h li.iehover a {
ความเป็นมา: #CCC;
สี: #FFF;
-
/ * เมนูที่ 2 *//
ul#navmenu-h li: Hover li a,
ul#navmenu-h li.iehover li a {
ลอย: ไม่มี;
ความเป็นมา: #eee;
สี: #666;
-
/ * เมนูที่ 2 HOVERSENTENCE *//
UL#NAVMENU-H LI: HOVER LI A: โฮเวอร์
ul#navmenu-h li: โฮเวอร์ li: โฮเวอร์ก
ul#navmenu-h li.iehover li a: โฮเวอร์
ul#navmenu-h li.iehover li.iehover a {
ความเป็นมา: #CCC;
สี: #FFF;
-
/ * เมนูที่ 3 *//
UL#NAVMENU-H LI: HOVER LI: HOVER LI A,
ul#navmenu-h li.iehover li.iehover li a {
ความเป็นมา: #eee;
สี: #666;
-
/ * เมนูที่ 3 HOVERSENTENCE *//
UL#NAVMENU-H LI: HOVER LI: HOVER LI A: โฮเวอร์,
ul#navmenu-h li: โฮเวอร์ li: โฮเวอร์ลี่: โฮเวอร์ก,
ul#navmenu-h li.iehover li.iehover li a: โฮเวอร์
ul#navmenu-h li.iehover li.iehover li.iehover a {
ความเป็นมา: #CCC;
สี: #FFF;
-
/ * เมนูที่ 4 *//
UL#NAVMENU-H LI: HOVER LI: HOVER LI: HOVER LI A,
ul#navmenu-h li.iehover li.iehover li.iehover li a {
ความเป็นมา: #eee;
สี: #666;
-
/ * เมนูที่ 4 โฮเวอร์ */
ul#navmenu-h li: โฮเวอร์ li: โฮเวอร์ลี่: โฮเวอร์ li a: โฮเวอร์,
ul#navmenu-h li.iehover li.iehover li.iehover li a: โฮเวอร์ {
ความเป็นมา: #CCC;
สี: #FFF;
-
ul#navmenu-h ul ul
ul#navmenu-h ul ul ul {
แสดง: ไม่มี;
ตำแหน่ง: สัมบูรณ์;
ด้านบน: 0;
ซ้าย: 160px;
-
/ * อย่าย้าย - ต้องมาก่อนแสดง: บล็อกสำหรับตุ๊กแก */
ul#navmenu-h li: Hover ul ul
ul#navmenu-h li: Hover ul ul ul
ul#navmenu-h li.iehover ul ul
ul#navmenu-h li.iehover ul ul ul {
แสดง: ไม่มี;
-
ul#navmenu-h li: โฮเวอร์ ul,
ul#navmenu-h ul li: Hover ul,
ul#navmenu-h ul ul li: โฮเวอร์ ul,
ul#navmenu-h li.iehover ul,
ul#navmenu-h ul li.iehover ul,
ul#navmenu-h ul ul li.iehover ul {
แสดง: บล็อก;
-
</style> <script language = "JavaScript">
navhover = function () {
var lis = document.getElementById ("navmenu-h"). getElementsByTagname ("li");
สำหรับ (var i = 0; i <lis.length; i ++) {
lis [i] .onmouseover = function () {
this.className+= "iehover";
-
lis [i] .onmouseout = function () {
this.className = this.className.replace (ใหม่ regexp ("iehover // b")
-
-
-
-
if (window.attachevent) window.attachevent ("onload", navhover);
</script>
</head>
<body>
<ul id = "navmenu-h">
<li> <a href = "#"> รูท NAV item1 </a>
<ul>
<li> <a href = "#"> sub nav item1 </a> </li>
<li> <a href = "#"> sub nav item1-2 </a> </li>
</ul>
</li>
<li> <a href = "#"> รายการรูท NAV 2 </a>
<ul>
<li> <a href = "#"> sub nav item2 </a> </li>
<li> <a href = "#"> sub nav item2-2 </a> </li>
</ul>
</li>
<li> <a href = "#"> รายการรูท NAV 3 </a>
<ul>
<li> <a href = "#"> sub nav item3 </a> </li>
<li> <a href = "#"> sub nav item3-2 </a> </li>
</ul>
</li>
</ul>
</body>
</html>