»
AnglaisFrançaisVietnamien

Imprimer - Multi Level Pull Down Menu - JavaScriptBank.com

Version complète: jsB@nk » Menu » Multilevel menu » Multi Level Pull Down Menu
URL: https://www.javascriptbank.com/multi-level-pull-down-menu.html

Multi Level Pull Down Menu © JavaScriptBank.comCet JavaScript vous permet d'associer une dynamique JavaScript menu régulièrement Liens sur votre page. Comme la souris se déplace sur le JavaScript lien dans le menu, un JavaScript menu apparaît contenant "sous les liens".

Version complète: jsB@nk » Menu » Multilevel menu » Multi Level Pull Down Menu
URL: https://www.javascriptbank.com/multi-level-pull-down-menu.html



CSS
<style type="text/css">#menu {BACKGROUND: lightblue; COLOR: black; CURSOR: default; FONT-FAMILY: verdana; FONT-SIZE: 10pt; FONT-WEIGHT: bold}#menu .popup {BACKGROUND: lightblue; BORDER-BOTTOM: lightblue 12px solid; BORDER-LEFT: lightblue 12px solid; BORDER-RIGHT: lightblue 12px solid; BORDER-TOP: lightblue 12px solid; DISPLAY: none; FONT-FAMILY: verdana; FONT-SIZE: 8px; POSITION: absolute; WIDTH: 160pt}#menu P {MARGIN-BOTTOM: 0pt; MARGIN-TOP: 0pt}A:hover {COLOR: red; TEXT-DECORATION: none}A {COLOR: black; FONT-SIZE:8pt; MARGIN: 5px; TEXT-DECORATION: none}UL {COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none}LI {COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none}P {COLOR: black; FONT-SIZE: 10pt; MARGIN: 5px; TEXT-DECORATION: none}.over {COLOR: red}P {TEXT-ALIGN: justify; TEXT-INDENT: 0.1in}</style><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<script language="JavaScript">         var curPop = null;         function clearCurrent() {            // Hide the pop-up menu that is currently displayed.            if (null != curPop)               curPop.style.display = "";            curPop = null;         }         function popup() { clearCurrent();              var el = event.srcElement;            // Display a new menu option.            if (("P" == el.tagName) &&                  ("menu" == el.parentElement.parentElement.parentElement.parentElement.id)) {               // Position and display the pop-up menu.               var elpop = document.all[el.sourceIndex + 1];               elpop.style.pixelLeft = el.parentElement.offsetLeft+7;               elpop.style.pixelTop  = el.offsetTop +                  document.all.menu.offsetTop+22;               elpop.style.display = "block";               curPop = elpop;            }            event.cancelBubble = true;         }         function highlight() {            // Highlight and popup  the menu options.            if (null != event.fromElement)               if ((event.fromElement.tagName == "P") &&  (event.fromElement.parentElement.parentElement.parentElement.parentElement.id == "menu"))  {                  event.fromElement.className = "";              }                        if (null != event.toElement)               if ((event.toElement.tagName == "P") && (event.toElement.parentElement.parentElement.parentElement.parentElement.id == "menu")){  popup();                  event.toElement.className = "over";}         }</script><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<body onclick="clearCurrent()"><div style="background: lightblue none repeat scroll 0%; -moz-background-clip: initial; -moz-background-inline-policy: initial; -moz-background-origin: initial;"><table border="0" id="menu" onclick="popup()" onmouseout="highlight();" onmouseover="highlight();">  <tbody>  <tr>    <td>      <a href="http://www.javascripts.com/">Home</a></td>    <td bgcolor="black"></td>    <td>      <p>Some Folder </p>      <div class="popup">      <p><a class="anchor" href="http://msdn.microsoft.com/">To Microsoft </a>       </p><p><a href="http://www.juventus.com/">To Juventus</a>       </p><p><a href="http://www.altavista.com/">To .... </a>       </p></div></td>    <td bgcolor="black"></td>    <td>      <p>What I Can</p>      <div class="popup">      <p><a href="http://javascriptbank.com/">JavaScriptBank.com</a>       </p><p><a href="http://www.learnasp.com/">ASP programming</a>  </p><p><a href="http://www.javasoft.com/">Java applets</a>  </p><p><a href="http://www.inprise.com/">Delphi programming</a>    </p></div></td>    <td bgcolor="black"></td>    <td>      <p>Contact with me</p>      <div class="popup">  <p><a href="mailto:medium@mail.wplus.net">just mail me</a>  </p></div><p></p></td></tr></tbody></table></div></body><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->