<style type="text/css"> * { font-size: 12px; } body { margin: 0px; } </style> <script language="JavaScript"> // Office XP 菜单 var sub_display = false; // 颜色数组说明：此数组储存菜单各部份颜色样式，可以改变颜色值达到改变样式的效果 // 值依次为：高亮背景色, 高亮边框色, 菜单栏背景色, 子菜单背景色, 子菜单边框色, 子菜单标题色, 子菜单阴影色 var color = ['#B6BDD2', '#0A246A', '#D4D0C8', '#F8F8F8', '#666666', '#DBD8D1', '#DDDDDD']; // 菜单数组说明：此数组储存各菜单数据 // 值依次为： // 1. 主菜单名称, 下拉菜单右延空白长度 // 2. 第1个子菜单名称, 链接地址 // 3. 第2个子菜单名称, 链接地址 // 4. ...... var menu = new Array(); menu[0] = [['菜单一', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; menu[1] = [['菜单二', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; menu[2] = [['菜单三', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; menu[3] = [['菜单四', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; menu[4] = [['菜单五', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; menu[5] = [['菜单六', 50], ['1111', '1.htm'], ['2222', '2.htm'], ['3333', '3.htm']]; document.write('<table width="100%" cellspacing="0" cellpadding="0" style="background-color: ' + color[2] + '; border-left: 1px #F4F4F4 solid; border-top: 1px #F4F4F4 solid; border-right: 1px #999999 solid; border-bottom: 1px #999999 solid;" onSelectStart="return false;" onContextMenu="return false;"><tr><td width="5"><img width="5" height="1"></td><td><table cellspacing="0" cellpadding="2"><tr>'); for (var i=0; i<menu.length; i++) document.write('<td style="border: 1px ' + color[2] + ' solid; cursor: default;" onClick="Menu_Click(this, ' + i + ')" onMouseOver="Menu_Over(this, ' + i + ')" onMouseOut="Menu_Out(this, ' + i + ')"><nobr><img width="10" height="1">' + menu[i][0][0] + '<img width="10" height="1"></nobr></td>'); document.write('</td></tr></table></tr></table>'); for (var i=0; i<menu.length; i++) { document.write('<table id="subMenu" cellspacing="0" cellpadding="0" onSelectStart="return false;" onContextMenu="return false;" style="position: absolute; display: none; top: 1px; border-left: 1px ' + color[4] + ' solid; border-bottom: 1px ' + color[4] + ' solid; cursor: default; filter:progid:dximagetransform.microsoft.dropshadow(color=' + color[6] + ',offx=3,offy=3,positive=true)"><tr><td style="border-top: 1px ' + color[4] + ' solid; border-right: 1px ' + color[4] + ' solid; background-color: ' + color[5] + ';" onClick="subMenu_Hide(false)"><nobr><img width="1" height="2"><br><img width="12" height="1">' + menu[i][0][0] + '<img width="12" height="1"><br><img width="1" height="3"></nobr></td><td style="border-bottom: 1px ' + color[4] + ' solid;" onMouseOver="subMenu_Hide(true)"><img width="' + menu[i][0][1] + '" height="1"></td></tr><tr><td colspan="2" style="border-right: 1px ' + color[4] + ' solid; background-color: ' + color[3] + ';"><table width="100%" cellspacing="1" cellpadding="2" style=" background-color: ' + color[3] + '">'); for (var j=1; j<menu[i].length; j++) document.write('<tr><td style="border: 1px ' + color[3] + ' solid;" onMouseOver="subMenu_Over(this)" onMouseOut="subMenu_Out(this)" onClick="location.href=\'' + menu[i][j][1] + '\'"><nobr> ' + menu[i][j][0] + '</nobr></td></tr>'); document.write('</td></tr></table></td></tr></table>'); } function Menu_Over(obj, s) { if (sub_display) { subMenu_Show(obj, s) } else { obj.style.backgroundColor = color[0]; obj.style.border = '1px ' + color[1] + ' solid'; } } function Menu_Out(obj) { obj.style.backgroundColor = ''; obj.style.border = '1px ' + color[2] + ' solid'; } function Menu_Click(obj, s) { subMenu_Show(obj, s) } function subMenu_Over(obj) { obj.style.backgroundColor = color[0]; obj.style.border = '1px ' + color[1] + ' solid'; } function subMenu_Out(obj) { obj.style.backgroundColor = ''; obj.style.border = '1px ' + color[3] + ' solid'; } function subMenu_Hide(hide) { for (var i=0; i<subMenu.length; i++) subMenu[i].style.display = 'none'; sub_display = hide; } function subMenu_Show(obj, s) { subMenu_Hide(false); subMenu(s).style.posLeft = obj.offsetLeft + 6; subMenu(s).style.display = ''; sub_display = true; } window.onfocus = subMenu_Hide; </script> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
