1. Insert the references to the xmenu-xlayer scripts in your page:

   <script language="JavaScript1.2" src="lib/js/Browser.js"></script>
   <script language="JavaScript1.2" src="lib/js/XlayerParent.js"></script>
   <script language="JavaScript1.2" src="lib/js/Xlayer.js"></script>
   <script language="JavaScript1.2" src="lib/js/Xmenu.js"></script>
   <script language="JavaScript1.2" src="lib/js/Xmenus.js"></script>
   <script language="JavaScript1.2" src="lib/js/XmenuConfig.js"></script>
 
   The example shown above has all files located in lib/js (which means that 
   you need a folder lib in your document-root and a folder js inside it). You
   can change that structure to your own needs, of course.
 

2. Build a config file and include it in your page by inserting a javascript 
   reference to it:

   <script language="XmenuConfig.js" src="XmenuConfig.js"></script>

   You can use a different file name of course. Explanations to the
   configuration options and structures can be found in further documents of
   this archive or in the example configuration "XmenuConfig.js" included in 
   this release.


3. Insert a javascript code block that instanciates the menus-controller and a 
   function that is executed when the browser finished loading the page:

   <script language="JavaScript1.2">

       var menus = new Xmenus( '', '' );

       function onLoad()
       {
           menus.create()
       }

   </script>

4. Put the reference to the onLoad()-function into your body tag:

   <body onLoad="onLoad()">

   You could further include a function that reloads the page, when
   the browser-window is resized. This fixes the fact, that your menu is not 
   at the correct position any more, if the browser window is resized. This
   happens because the browser resizes all resizable containers of your page
   (tables, divs, etc. with relative sizes).

   function onResize()
   {
       window.location.reload();
   }
                                
   and the new body tag:

   <body onLoad="onLoad()" onResize="onResize()">


5. Insert the menus defined in your configuration ( "XmenuConfig.js" ) into 
   your layout:

   <script language="JavaScript1.2">
       menus.add( pasta );
   </script>

   According to this example, you defined a menu named pasta in "XmenuConfig.js"
   The easiest way to have the menus appearing at the right positions, is to 
   build a table where you put the menu-add's. That would look like that:

   <table width="760" height="600" cellspacing="0" cellpadding="0" border="1">
       <tr>
           <td height="50" valign="top">
               <script language="JavaScript1.2">
                   menus.add( pastaVertical );
               </script>
           </td>
       </tr>
       <tr>
           <td height="50" valign="top">
               <script language="JavaScript1.2">
                   menus.add( pastaHorizontal );
               </script>
           </td>
       </tr>
       <tr>
           <td height="150" valign="top">
               <script language="JavaScript1.2">
                   menus.add( pastaCollapsing );
               </script>
           </td>
       </tr>
   </table>
