				DHTML Context Menus
				Version 1.0

				Script by Will Martin
				selanit@atuan.com
				9 January 2001

	This archive should contain thes files:

		context-menus-readme.txt
		context-menus.js
		context-menus.css
		context-menus.html


				Introduction:

This script is intended to be used to provide pop up context menus for web pages. 

Example: Sue clicks on a link.  In response, a menu of three choices appears at the 
spot where she clicked.  She selects one, and is off to a different page.

Example 2: Rachel clicks on the same link, and get the same menu of three choices.
However, she decides not to click any of them, and continue studying the page she is 
currently at.  Half a second after she moves her mouse away from the menu, it vanishes.

To see the script in action for yourself, please open context-menus.html, which 
is a demonstration file.


				Installation:

1) Copy context-menus.js and context-menus.css to a convenient directory, either the same 
one you keep your HTML files in, or in a sub-directory specifically for scripts.  Or 
whatever.

2) In the file you inted to use the script in, add these lines to your <head>:

	<link rel="stylesheet" type="text/css" href="context-menus.css">
	<script type="text/javascript" language="javascript1.2" src="context-menus.js">
	</script>

These lines link to the stylesheet and the JavaScript code for the menus.  You can edit 
the stylesheet to give your menus a distincive look.  You probably won't need to look 
at the JavaScript -- I wrote it so that the script does not need to be modified to work 
on any page.  If you WANT to look at it, feel free; you'll find that I have put in 
extensive comments about each function.

3) Still in your <head>, add this short script:

	<script type="text/javascript" language="javascript1.2">
	<!-- Hide script from older browsers

	MenuList = new Array();
	MenuList[0] = "Banana";
	MenuList[1] = "Apple";
	MenuList[2] = "Orange";

	// Stop hiding script-->
	</script>

Remember that the array subscript needs to start at 0.  Also, the array name "MenuList" is 
case-sensitive; you must capitalize the M and the L, or else you'll get annoying error 
messages. Your menu names can be anything, and you can have as many as you like.

4) Make sure your <body> tag looks like this:

	<body onLoad="InitClickDetection();">

You can have other stuff in the <body> tag as usual, of course -- just make sure you have 
the onLoad event there, too.

5) Create the menus that will pop up when you user clicks a link, like this:

	<div class="SubMenu" ID="Banana">
	<layer onMouseOver="Extender();" onMouseOut="HideDelay();">
	<table bgcolor="#666999" onMouseOver="Extender();" onMouseOut="HideDelay();">
	<tr>
	    <td><a href="http://www.atuan.com/code/" class="MenuItem">Your Item 1</a></td>
	</tr>
	<tr>
	    <td><a href="http://www.atuan.com/code/" class="MenuItem">Your Item 2</a></td>
	</tr>
	</table>
	</layer>
	</div>

You'll need one <div> <layer> pair for each menu that you put in the list at the top of the 
HTML file.  Note the onMouseOver and onMouseOut events in the <layer> and the <table> tags. 
Those govern how long the menu stays there; they must be there.  There are two copies of 
the events, because Netscape doesn't recognize mouse over/out events for <table> tags, and 
Internet Explorer doesn't recognize the <layer> tag at all.  Putting the events in both 
tags ensures that the events will be recognized by both browsers.

The menu must consist of a <table> encapsulated in a <layer> and a <div>.  The table can 
be any form you want.  Basically, don't change the <layer> tag, change the ID on the <div> 
tag but nothing else, and leave the onMouseOver and onMouseOut events in the <table> tag.  
Other than that, you can do as you please.

6)  Now that everything else is done, you need to construct the links that will activate 
the context menus you've made.  They should look like this:

<a href="javascript:PopUp('Banana', 1);" onMouseOut="HideDelay();" onMouseOver="Hide();">Your Link Name</a>

And that should do it.  If you've followed instructions carefully, you should be able to 
open your file in a browser and see it work.


				Compatibility:

To my knowledge, this script works well in both Internet Explorer and Netscape versions 4 
and higher.  I have not tested it with Netscape 6, and would appreciate it if somebody 
who has NS 6 could let me know how it worked out.  Anyway, it should work well for 
approximately 95% of the visitors to your site.  There's little to be done about people who 
use version 3 or lower of IE or NS, other than to encourage them to upgrade.  

As for folks who use a 3rd party browser, well, they made their bed and they can sleep 
in it.  If the script doesn't work for them, they've no cause to complain.




Hope you enjoy the script.  Please send comments and bug reports to selanit@atuan.com.  No 
spam, please.  It's always nice to get adoring fan letters, hint hint.

Will Martin

PS -- if what you're actually after is a drop-down menu, I've got a script for that, too.  
In fact, this script is really a modification of my drop-down menu script.  Both are 
available at:

http://www.atuan.com/code/