<!-- w w w . h t m l . i t -->

<HTML>
<HEAD>

<!-- Codice scaricato gratuitamente da HTML.it, il sito italiano sul Web publishing
                                   http://www.html.it -->

<TITLE>Demo Dynamic HTML: esempio pratico </TITLE>

      <STYLE TYPE="text/css">
         /* Make the menu float to the left of the text. */
         #menu {float:left; width:50pt; background:lightgrey;
            border:2px white outset; cursor:default} 
         /* Hide the pop-up menus initially. */
         #menu .popup {position:absolute; display:none;
            background:lightgrey; border:2px white outset;
            width:135pt; margin:2pt}
         #menu P {margin-top:0pt; margin-bottom:0pt}
         .over {color:navy; font-weight:bold}
      </STYLE>
      <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() {
            var el = event.srcElement;
            clearCurrent();
            // Display a new menu option.
            if (("P" == el.tagName) &&
                  ("menu" == el.parentElement.id)) {
               // Position and display the pop-up menu.
               var elpop = document.all[el.sourceIndex + 1];
               elpop.style.pixelLeft = document.all.menu.offsetLeft +
                  document.all.menu.offsetWidth - 7;
               elpop.style.pixelTop  = el.offsetTop +
                  document.all.menu.offsetTop;
               elpop.style.display = "block";
               curPop = elpop;
            }
            event.cancelBubble = true;
         }

         function highlight() {
            // Highlight the menu options.
            if (null != event.fromElement)
               if ((event.fromElement.tagName == "P") &&
                     (event.fromElement.parentElement.id == "menu"))
                  event.fromElement.className = "";
            if (null != event.toElement)
               if ((event.toElement.tagName == "P") &&
                     (event.toElement.parentElement.id == "menu"))
                  event.toElement.className = "over";
         }
      </SCRIPT>

</HEAD>

<BODY bgcolor="white"  ONCLICK="clearCurrent()">

 <DIV ID="menu" ONCLICK="popup()" ONMOUSEOVER="highlight()"
            ONMOUSEOUT="highlight()">
         <P>HTML
            <DIV CLASS="popup">
               <P><A HREF="http://www.html.it">Indice</A>
               <P><A HREF="http://www.html.it">Gif</A>
               <P><A HREF="http://www.html.it">JavaScript</A>
               <P><A HREF="http://www.html.it">Sfondi</A>
               <P><A HREF="http://www.html.it">Controlli</A>
       </DIV>          
         <P>Altri
            <DIV CLASS="popup">
               <P><A HREF="http://www.microsoft.com">Microsoft</A>
               <P><A HREF="http://inews.tecnet.it">Internet News</A>
               
            </DIV>

</div>

</body>
</html>
<!-- w w w . h t m l . i t -->
