📄 index.html
字号:
activeFeature = null; el.onmouseover = function() { if (activeFeature == this) return; if (activeFeature) activeFeature.className = "brief"; activeFeature = this; this.className += " brief-active"; document.getElementById('featdesc').innerHTML = '<div style="margin-left: 1px; padding: 0 1em;">' + this.info.details.innerHTML + '</div>'; }; } function patchFeatures() { var i = document.getElementById("first-feature"); for (; i; i = i.nextSibling) { if (i.nodeType != 1) continue; // skip non-element nodes if (/feature/.test(i.className)) featInstall(i); } } current_section = null; function showSection(id) { if (mainmenu) { mainmenu.items["menu-item-sec-" + id].disable(); if (current_section) mainmenu.items["menu-item-sec-" + current_section].disable(false); if (current_section == 'setup') { other_menu.destroy(); } } document.getElementById("frame-content").src = "docs/" + id + ".html"; current_section = id; } function sectionLoaded(body) { var c = document.getElementById("div-content"); c.innerHTML = body.innerHTML; PieNG(c); other_menu = document.getElementById("menu"); if (other_menu) other_menu = DynarchMenu.setup(other_menu); window.scrollTo(0, 0); if (current_section == 'features') patchFeatures(); } var browser_support = { "msie50" : "IE 5.0/Win: Excellent mouse support, good keyboard support, no PNG icons, no smooth shadows.", "msie55" : "IE 5.5/Win: Excellent mouse support, good keyboard support.", "msie60" : "IE 6.0/Win: Excellent mouse support, good keyboard support.", "mozilla" : "All Gecko-based browsers: Excellent support in every aspect.", "opera6x" : "Opera 6.x: Not tested, assumed to fail.", "opera7x" : "Opera 7.x: Excellent mouse support, poor keyboard support.", "konqueror" : "Konqueror: full mouse support, no keyboard support.", "safari" : "Apple Safari: full mouse support, no keyboard support." }; function showBrowser(id) { var txt = browser_support[id]; if (typeof txt == "string") { alert(txt); } } function initPage() { mainmenu = DynarchMenu.setup('page-menu', { shadows: [-1, 0, 5, 5], scrolling: true }); showSection('overview'); } //]]></script> </head> <body style="overflow: auto" onload="initPage()" id="document"> <a class="logo" title="Visit Our Website" href="http://www.dynarch.com/"><img src="img/logo.png" width="100" height="96" alt="Visit Our Website" /></a> <h1 style="text-align: center; margin: 10px 0; border-top: 1px solid #888; border-bottom-width: 1px; background-color: #c9c9c9;" >The Perfect DHTML Menus</h1> <table style="width: 90%; margin: 0 auto; border: 1px solid #555;" align="center" cellspacing="0" cellpadding="0"> <tr style="height: 1em"><td style="height: 1em"> <ul id="page-menu" style="display: none;"> <li title="Documentation, browser support, samples"> <img src="icons/hmenu.png" width="18" height="18" alt="" /> <a><span class="downarrow">Dynarch_Menu</span></a> <ul> <li id="menu-item-sec-overview"> <img src="icons/magnifier.gif" alt="" /> <a href="javascript:retval=showSection('overview');" title="Menu overview">_Overview</a> </li> <li id="menu-item-sec-features"> <img src="icons/features.png" width="18" height="18" alt="" /> <a href="javascript:retval=showSection('features');" title="Features list">_Features</a> </li> <li title="Menu documentation"> _Documentation <ul> <li id="menu-item-sec-files"> <a href="javascript:retval=showSection('files');" title="Archive files">_Files</a> </li> <li id="menu-item-sec-load"> <a href="javascript:retval=showSection('load');" title="Load the scripts">_Load it</a> </li> <li id="menu-item-sec-setup"> <a href="javascript:retval=showSection('setup');" title="How to setup menu">_Setup</a> </li> <li id="menu-item-sec-anatomy"> <a href="javascript:retval=showSection('anatomy');" title="Anatomy of a menu">_Menu anatomy</a> </li> <li id="menu-item-sec-classes"> <a href="javascript:retval=showSection('classes');" title="Special class names">Special class names</a> </li> <li id="menu-item-sec-config"> <a href="javascript:retval=showSection('config');" title="Customizing the menu">_Customization</a> </li> <li></li> <li id="menu-item-sec-actions"> <a href="javascript:retval=showSection('actions');" title="Unique event handler">Advanced handlers</a> </li> <li id="menu-item-sec-item-object"> <a href="javascript:retval=showSection('item-object');" title="Advanced API to DynarchMenu">The MenuItem object</a> </li> <li></li> <li id="menu-item-sec-skins"> <a href="javascript:retval=showSection('skins');" title="Customizing the CSS file">S_kin files</a> </li> <li id="menu-item-sec-icons"> <a href="javascript:retval=showSection('icons');" title="Some notes about the icons">_Icons</a> </li> <li></li> <li id="menu-item-sec-deviation"> <a href="javascript:retval=showSection('deviation');" title="Deviations from Web standards">_Deviations from W3C</a> </li> </ul> </li> <li id="menu-item-sec-faq" title="Frequently asked questions"> <a href="javascript:showSection('faq')">FA_Q</a> </li> <li> _Browser support <ul> <li> <img src="icons/mozilla.gif" alt="" /> _Gecko <ul> <li> <img src="icons/mozilla.gif" alt="" /> <a href="javascript:showBrowser('mozilla')">_Mozilla</a> </li> <li> <img src="icons/firebird.gif" alt="" /> <a href="javascript:showBrowser('mozilla')">Mozilla Fire_Bird</a> </li> <li> <img src="icons/firefox.gif" alt="" /> <a href="javascript:showBrowser('mozilla')">Mozilla Fire_Fox</a> </li> <li> <img src="icons/netscape.gif" alt="" /> <a href="javascript:showBrowser('mozilla')">_Netscape</a> </li> <li></li> <li> <a href="javascript:showBrowser('mozilla')">_Other Gecko-s</a> </li> </ul> </li> <li> <img src="icons/win.gif" alt="" /> Internet E_xplorer/Win <ul> <li> <a href="javascript:showBrowser('msie50')">5.0</a> </li> <li> <a href="javascript:showBrowser('msie55')">_5.5</a> </li> <li> <a href="javascript:showBrowser('msie60')">_6.0</a> </li> </ul> </li> <li> <img src="icons/opera.gif" alt="" /> _Opera <ul> <li> <a href="javascript:showBrowser('opera6x')">_6.x</a> </li> <li> <a href="javascript:showBrowser('opera7x')">_7.x</a> </li> </ul> </li> <li> <img src="icons/konqueror.gif" alt="" /> <a href="javascript:showBrowser('konqueror')">_Konqueror</a> </li> <li> <img src="icons/apple.gif" alt="" /> <a href="javascript:showBrowser('safari')">Apple _Safari</a> </li> </ul> </li> <li></li> <li title="Other samples (each opens in new window)"> Samples <ul><li><a href="examples/" target="_blank" title="Go to examples index"><b>Examples index</b></a></li><li></li><li><a href="examples/actions.html" target="_blank" title="Describes various actions that can be fired by menu items (opens new window)">Item actions</a></li><li><a href="examples/big.html" target="_blank" title="A big menu, featuring lazy initialization. (opens new window)">Really big menus</a></li><li><a href="examples/clone-popups.html" target="_blank" title="Display the same popup menu in multiple places (opens new window)">Clone popups</a></li><li><a href="examples/context.html" target="_blank" title="You can specify context menu for any HTML element (opens new window)">Context menus part #1</a></li><li><a href="examples/context2.html" target="_blank" title="Context menus for all elements having a certain class (opens new window)">Context menus part #2</a></li><li><a href="examples/context3.html" target="_blank" title="Context menus for dynamically created elements (opens new window)">Context menus part #3</a></li><li><a href="examples/context4.html" target="_blank" title="Using the onPopup JavaScript handler (opens new window)">Context menus part #4</a></li><li><a href="examples/context5.html" target="_blank" title="Menus that popup on arbitrary HTML elements upon keybindings (opens new window)">Keyboard-triggered popup menus</a></li><li><a href="examples/different-colors.html" target="_blank" title="Shows you how you can customize individual menu popups and items based on class names (opens new window)">Individual customization</a></li><li><a href="examples/electric.html" target="_blank" title="Demonstrates the 鈥渆lectric鈥⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -