GlideMenus

Getting Started

Download the Package First

The easiest way to learn how to use GlideMenus is to modify the HTML and CSS in the demos (onsite link). All of the colors, borders, and fonts can be easily changed right in the CSS file. To change the behavior, modify the GlideParams object.

If you have not already done so, download the package and save a duplicate copy.

This tutorial is divided into sections:

1. Ingredients - what you need to make GlideMenus
2. HTML Structure- explains the structure that the demos use
3. Event Handlers
   1. actuatorMouseover & actuatorMouseout
   2. showMenu and hideMenu
   3. headerMouseover and headerMouseout
   4. showSubMenu and hideSubMenu
4. CSS - Modifying for your needs
5. GlideParams - Modifying for your needs
6. Compatibility for Netscape 4 and Internet Explorer for Macintosh
7. GlideMenus API reference - onbeforechange, onchange, setEventType, removeTabs
8. Frequently Asked Questions

About the Sourcecode

In order to minimize file size, whitespace has been removed from glidemenus.js. The file contents global.js and cookie.js have included in glidemenus.js (without whitespace). This reduces download time by reducing the number of HTTP transactions and by reducing the file size by over 30%.

Human readable source-code is available in the zip file.

Next in this tutorial: The ingredients — putting the images, scripts, and CSS into the HTML