Tip: you can modify some code before running
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>JS drop-down menu, how to be compatible with FF</tITLE><META http-equiv=Content-Type content="text/html; charset=gbk"><META content=index,follow name=robots><META content=无忧脚本,无忧,脚本,JavaScript,JS,HTML,DHTML,CSS,XML,XSL name=keywords><script src="http://www.suiyuan-tech.cn/web/suiyuan/js/util.js" type=text/javascript></script><style>BODY,html{MARGIN: 0px; COLOR: #333333; SCROLLBAR-ARROW-COLOR: #86b9d6; SCROLLBAR-DARKSHADOW-COLOR: #bbe9ff; SCROLLBAR-BASE-COLOR: #f5fbff; BACKGROUND-COLOR: #ffffff}BODY,td,tr {FONT: 12px Tahoma, Verdana}TABLE {BORDER-COLLAPSE: collapse; empty-cells: show}A {COLOR: #154ba0; TEXT-DECORATION: none}A:hover {COLOR: #ff0000;TEXT-DECORATION: underline}.nav {FONT-WEIGHT: bold; COLOR: #154ba0}.nav A {COLOR: #154ba0}.bold {FONT-WEIGHT: bold}.headermenu_popup {BORDER: #86b9d6 1px solid;MARGIN-TOP: 8px! important; COLOR: #154ba0;background:url([img]http://www.suiyuan-tech.cn/web/suiyuan/pic/menu_td.gif[/img]);background-position: left;background-repeat:repeat-y;BACKGROUND-COLOR: #e1f9fe;}.menu_td {height:26px;PADDING:3px 8px; COLOR: #154ba0;border-bottom: 1px solid #bddee4; WHITE-SPACE: nowrap}.menu_td A {height:26px;PADDING:3px 8px; COLOR: #154ba0;TEXT-DECORATION: none}.popupmenu_popup {BORDER: #86b9d6 1px solid; COLOR: #154ba0;}.popupmenu_option {PADDING-RIGHT: 8px; PADDING-LEFT: 8px; PADDING-BOTTOM: 3px;PADDING-TOP: 3px; background: #D9EEF9; COLOR: #154ba0; WHITE-SPACE: nowrap}.popupmenu_option A {PADDING-RIGHT: 8px; PADDING-LEFT: 8px; PADDING-BOTTOM: 3px; PADDING-TOP: 3px; COLOR: #154ba0;TEXT-DECORATION: none}.popupmenu_highlight {PADDING-RIGHT: 8px; PADDING-LEFT: 8px; PADDING-BOTTOM: 3px; PADDING-TOP: 3px;BACKGROUND: #7ac4ea; CURSOR: pointer; COLOR: #ffffff; WHITE-SPACE: nowrap}.popupmenu_highlight A {PADDING-RIGHT: 8px; PADDING-LEFT: 8px; PADDING-BOTTOM: 3px; PADDING-TOP: 3px;COLOR: #ffffff; TEXT-DECORATION: none}</style><SCRIPT type=text/javascript>// Compatible with mainstream browsers // var userAgent = navigator. userAgent. toLowerCase (); var is_webtv = userAgent. indexOf ('webtv ')! =-1; var is_kon = userAgent. indexOf ('konqueror ')! =-1; var is_mac = userAgent. indexOf ('Mac ')! =-1; var is_saf = userAgent. indexOf ('applewebkit ')! =-1 | navigator. vendor = 'Apple Computer, Inc. '; var is_opera = userAgent. indexOf ('Opera ')! =-1 & opera. version (); var is_moz = (navigator. product = 'Gecko '&&! Is_saf) & userAgent. substr (userAgent. indexOf ('Firefox ') + 8, 3); var is_ns = userAgent. indexOf ('compute') =-1 & userAgent. indexOf ('mozilla ')! =-1 &&! Is_opera &&! Is_webtv &&! Is_saf; var is_ie = (userAgent. indexOf ('msi ')! =-1 &&! Is_opera &&! Is_saf &&! Is_webtv) & userAgent. substr (userAgent. indexOf ('msi') + 5, 3 ); // base ///////////////////////////////////// /// function findtags (parentobj, tag) {if (! IsUndefined (parentobj. getElementsByTagName) {return parentobj. getElementsByTagName (tag);} else if (parentobj. all & parentobj. all. tags) {return parentobj. all. tags (tag) ;}else {return null ;}} function $ (id) {return document. getElementById (id);} function isUndefined (variable) {return typeof variable = 'undefined '? True: false;} function doane (event) {e = event? Event: window. event; if (is_ie) {e. returnValue = false; e. cancelBubble = true;} else {e. stopPropagation (); e. preventDefault ();}} // base ///////////////////////////////////// /// var jsmenu = new Array (); jsmenu ['active'] = new Array (); jsmenu ['timer'] = new Array (); jsmenu ['iframe'] = new Array (); function initCtrl (ctrlobj, click, duration, timeout, layer) {if (ctrlobj &&! Ctrlobj. initialized) {ctrlobj. initialized = true; ctrlobj. unselectable = true; ctrlobj. outfunc = typeof ctrlobj. onmouseout = 'function '? Ctrlobj. onmouseout: null; ctrlobj. onmouseout = function () {if (this. outfunc) this. outfunc (); if (duration <3) jsmenu ['timer'] [ctrlobj. id] = setTimeout ('hidemenu ('+ layer +') ', timeout);} if (click & duration) {ctrlobj. clickfunc = typeof ctrlobj. onclick = 'function '? Ctrlobj. onclick: null; ctrlobj. onclick = function (e) {doane (e); if (jsmenu ['active'] [layer] = null | jsmenu ['active'] [layer]. ctrlkey! = This. id) {if (this. clickfunc) this. clickfunc (); else showMenu (this. id, true) ;}else {hideMenu (layer) ;}} ctrlobj. overfunc = typeof ctrlobj. onmouseover = 'function '? Ctrlobj. onmouseover: null; ctrlobj. onmouseover = function (e) {doane (e); if (this. overfunc) this. overfunc (); if (click) {clearTimeout (jsmenu ['timer'] [this. id]);} else {for (var id in jsmenu ['timer']) {if (jsmenu ['timer'] [id]) clearTimeout (jsmenu ['timer'] [id]) ;}}} function initMenu (ctrlid, menuobj, duration, timeout, layer) {if (menuobj &&! Menuobj. initialized) {menuobj. initialized = true; menuobj. ctrlkey = ctrlid; menuobj. onclick = ebygum; menuobj. style. position = 'absolute '; if (duration <3) {if (duration> 1) {menuobj. onmouseover = function () {clearTimeout (jsmenu ['timer'] [ctrlid]) ;}} if (duration! = 1) {menuobj. onmouseout = function () {jsmenu ['timer'] [ctrlid] = setTimeout ('hidemenu ('+ layer +') ', timeout) ;}} menuobj. style. zIndex = 50; if (is_ie &&! Is_mac) {menuobj. style. filter + = "progid: DXImageTransform. microsoft. shadow (direction = 135, color = # CCCCCC, strength = 2) ";} initMenuContents (menuobj) ;}} function initMenuContents (menuobj) {if (menuobj. title = 'menu ') {menuobj. style. filter + = "progid: DXImageTransform. microsoft. alpha (opacity = 85, finishOpacity = 100, style = 0) "; menuobj. style. opacity = 0.85; menuobj. title = '';} else {var tds = findtags (menuobj, 'TD '); For (var I = 0; I <tds. length; I ++) {if (tds [I]. className = 'popupmenu _ option' | tds [I]. className = 'Editor _ colornormal') {if (is_ie &&! Is_mac) {tds [I]. style. filter + = "progid: DXImageTransform. microsoft. alpha (opacity = 85, finishOpacity = 100, style = 0) ";} tds [I]. style. opacity = 0.85; if (tds [I]. title & tds [I]. title = 'nohighlight') {tds [I]. title = '';} else {tds [I]. ctrlkey = this. ctrlkey; if (tds [I]. className! = 'Editor _ colornormal') {tds [I]. onmouseover = menuoption_onmouseover; tds [I]. onmouseout = menuoption_onmouseout;} if (typeof tds [I]. onclick = 'function') {tds [I]. clickfunc = tds [I]. onclick; tds [I]. onclick = menuoption_onclick_function;} else {tds [I]. onclick = menuoption_onclick_link;} if (! Is_saf &&! Is_kon) {try {links = findtags (tds [I], 'A'); for (var j = 0; j <links. length; j ++) {if (isUndefined (links [j]. onclick) {links [j]. onclick = ebygum ;}}} catch (e) {}}}} function showMenu (ctrlid, click, offset, duration, timeout, layer, showid, maxh) {var ctrlobj = $ (ctrlid); if (! Ctrlobj) return; if (isUndefined (click) click = false; if (isUndefined (offset) offset = 0; if (isUndefined (duration) duration = 2; if (isUndefined (timeout) timeout = 500; if (isUndefined (layer) layer = 0; if (isUndefined (showid) showid = ctrlid; var showobj = $ (showid); var menuobj = $ (showid + '_ menu'); if (! Showobj |! Menuobj) return; if (isUndefined (maxh) maxh = 400; hideMenu (layer); for (var id in jsmenu ['timer']) {if (jsmenu ['timer'] [id]) clearTimeout (jsmenu ['timer'] [id]);} initCtrl (ctrlobj, click, duration, timeout, layer ); initMenu (ctrlid, menuobj, duration, timeout, layer); menuobj. style. display = ''; if (! Is_opera) {menuobj. style. clip = 'rect (auto, auto) ';} var showobj_pos = fetchOffset (showobj); var showobj_x = showobj_pos ['left']; var showobj_y = showobj_pos ['top']; var showobj_w = showobj. offsetWidth; var showobj_h = showobj. offsetHeight; var menuobj_w = menuobj. offsetWidth; var menuobj_h = menuobj. offsetHeight; menuobj. style. left = (showobj_x + menuobj_w> document. body. clientWidth) & (show Obj_x + showobj_w-menuobj_w> = 0 )? Showobj_x + showobj_w-menuobj_w + 'px ': showobj_x + 'px'; menuobj. style. top = offset = 1? Showobj_y + 'px ': (offset = 2 | (showobj_y + showobj_h + menuobj_h> document. body. scrollTop + document. body. clientHeight) & (showobj_y-menuobj_h> = 0 ))? (Showobj_y-menuobj_h) + 'px ': showobj_y + showobj_h + 'px'); if (menuobj. style. clip &&! Is_opera) {menuobj. style. clip = 'rect (auto, auto, auto) ';} if (is_ie & is_ie <7) {if (! Jsmenu ['iframe'] [layer]) {var iframe = document. createElement ('iframe'); iframe. style. display = 'none'; iframe. style. position = 'absolute '; iframe. style. filter = 'progid: DXImageTransform. microsoft. alpha (style = 0, opacity = 0) '; $ ('jsmenu _ parent ')? $ ('Jsmenu _ parent '). appendChild (iframe): menuobj. parentNode. appendChild (iframe); jsmenu ['iframe'] [layer] = iframe;} jsmenu ['iframe'] [layer]. style. top = menuobj. style. top; jsmenu ['iframe'] [layer]. style. left = menuobj. style. left; jsmenu ['iframe'] [layer]. style. width = menuobj_w; jsmenu ['iframe'] [layer]. style. height = menuobj_h; jsmenu ['iframe'] [layer]. style. display = 'block';} if (maxh & menuobj. scrollHeigh T> maxh) {menuobj. style. height = maxh + 'px '; if (is_opera) {menuobj. style. overflow = 'auto';} else {menuobj. style. overflowY = 'auto';} if (! Duration) {setTimeout ('hidemenu ('+ layer +') ', timeout);} jsmenu ['active'] [layer] = menuobj;} function hideMenu (layer) {if (isUndefined (layer) layer = 0; if (jsmenu ['active'] [layer]) {clearTimeout (jsmenu ['timer'] [jsmenu ['active'] [layer]. ctrlkey]); jsmenu ['active'] [layer]. style. display = 'none'; if (is_ie & is_ie <7 & jsmenu ['iframe'] [layer]) {jsmenu ['iframe'] [layer]. style. display = 'none';} jsmenu ['AC Tive '] [layer] = null;} function fetchOffset (obj) {var left_offset = obj. offsetLeft; var top_offset = obj. offsetTop; while (obj = obj. offsetParent )! = Null) {left_offset + = obj. offsetLeft; top_offset + = obj. offsetTop;} return {'left': left_offset, 'top': top_offset};} function ebygum (eventobj) {if (! Eventobj | is_ie) {window. event. cancelBubble = true; return window. event;} else javasif(eventobj.tar get. type = 'submit ') implements eventobj.tar get. form. submit ();} eventobj. stopPropagation (); return eventobj;} function menuoption_onclick_function (e) {this. clickfunc (); hideMenu ();} function menuoption_onclick_link (e) {choose (e, this);} function menuoption_onmouseover (e) {this. className = 'popupmenu _ highlight ';} function menuoption_onmouseout (e) {this. className = 'popupmenu _ option';} function choose (e, obj) {var links = findtags (obj, 'A'); if (links [0]) {if (is_ie) {links [0]. click (); window. event. cancelBubble = true;} else {if (e. shiftKey) {window. open (links [0]. href); e. stopPropagation (); e. preventDefault ();} else {window. location = links [0]. href; e. stopPropagation (); e. preventDefault () ;}} hideMenu ();}}</sCRIPT></hEAD><BODY ><table width="600" border="0" align="center" cellpadding="0" cellspacing="0" height="50" > <tr> <td> <SPAN id=navi onmouseover=showMenu(this.id)>Control panel</sPAN> </td> <td> <SPAN id=navilist onmouseover=showMenu(this.id)>Carefree script</sPAN> </td> </tr> <tr> <td colspan="2"><script>viewFlash("http://www.suiyuan-tech.cn/web/suiyuan/flash/top.swf", '920', '239');</script></td> </tr></table><DIV class=popupmenu_popup id=navilist_menu ><TABLE cellSpacing=0 cellPadding=4 border=0 > <TR><TD class=popupmenu_option>Carefree script</tD></tR> <TR><TD class=popupmenu_option>Worry-free script technology discussion area</tD></tR> <TR><TD class=popupmenu_option>> Original articles & discussion summary</tD></tR> <TR><TD class=popupmenu_option>> Html & XHtml & CSS webpage creation discussion</tD></tR> <TR><TD class=popupmenu_option>> JavaScript & VBScript & DHTML script technology discussion version</tD></tR> <TR><TD class=popupmenu_option>> XML & XSL & XPath & VML webpage technical discussion</tD></tR> <TR><TD class=popupmenu_option>Carefree script</tD></tR> <TR><TD class=popupmenu_option>Worry-free script technology discussion area</tD></tR> <TR><TD class=popupmenu_option>> Original articles & discussion summary</tD></tR> <TR><TD class=popupmenu_option>> Html & XHtml & CSS webpage creation discussion</tD></tR> <TR><TD class=popupmenu_option>> JavaScript & VBScript & DHTML script technology discussion version</tD></tR> <TR><TD class=popupmenu_option>> XML & XSL & XPath & VML webpage technical discussion</tD></tR> <TR><TD class=popupmenu_option>Carefree script</tD></tR> <TR><TD class=popupmenu_option>Worry-free script technology discussion area</tD></tR> <TR><TD class=popupmenu_option>> Original articles & discussion summary</tD></tR> <TR><TD class=popupmenu_option>> Html & XHtml & CSS webpage creation discussion</tD></tR> <TR><TD class=popupmenu_option>> JavaScript & VBScript & DHTML script technology discussion version</tD></tR> <TR><TD class=popupmenu_option>> XML & XSL & XPath & VML webpage technical discussion</tD></tR> <TR><TD class=popupmenu_option>Carefree script</tD></tR> <TR><TD class=popupmenu_option>Worry-free script technology discussion area</tD></tR> <TR><TD class=popupmenu_option>> Original articles & discussion summary</tD></tR> <TR><TD class=popupmenu_option>> Html & XHtml & CSS webpage creation discussion</tD></tR> <TR><TD class=popupmenu_option>> JavaScript & VBScript & DHTML script technology discussion version</tD></tR> <TR><TD class=popupmenu_option>> XML & XSL & XPath & VML webpage technical discussion</tD></tR> <TR><TD class=popupmenu_option>Control panel homepage</tD></tR> <TR><TD class=popupmenu_option>Edit personal data</tD></tR> <TR><TD class=popupmenu_option>Point transaction</tD></tR> <TR><TD class=popupmenu_option>Public User Group</tD></tR> <TR><TD class=popupmenu_option>Friend List</tD></tR> <TR><TD class=popupmenu_option>Upgrade personal space</tD></tR></tABLE></dIV> <DIV class=headermenu_popup id=navi_menu ><TABLE cellSpacing=0 cellPadding=4 border=0> <TR><TD class=menu_td>Control panel homepage</tD></tR> <TR><TD class=menu_td>Edit personal data</tD></tR> <TR><TD class=menu_td>Point transaction</tD></tR> <TR><TD class=menu_td>Public User Group 55555555555555555555</tD></tR> <TR><TD class=menu_td>Friend List</tD></tR> <TR><TD class=menu_td>Upgrade personal space</tD></tR></tABLE></dIV></bODY></hTML>
Tip: you can modify some code before running
