// Initialize WebDDM
function initWebDDM ()
{
	// Begin base menu
	var menu = {
		'position':'relative',
		'top':0,
		'left':0,
		'width':500,
		'height':30,
		'expand_menu':'context(context,document)',
		'contract_menu':'rollout',

		'items':{
			'top':0,
			'left':0,

			'background-item':{
				'width':133,
				'height':63,
				'left': 0,
				'top': 0,
				'class':'container'
			},

			1:{
				'content':'<a href="../index.html">Home</a>',
				'cursor':'hand',
				'width':130, 'height':20, 'offsetLeft':1, 'offsetTop':1,
				'class':'win9x_off',
				'class_rollover':'win9x_rollover'
			},
			2:{
				'content':'<a href="../index.html">More Info &nbsp; <img src="../menus/context/arrow.gif" /></a>',
				'content_menuopen':'<a href="../index.html">More Info &nbsp; <img src="../menus/context/arrowover.gif" /></a>',
				'width':130, 'height':20,
				'offsetLeft':0, 'offsetTop':20,
				'class':'win9x_off',
				'class_menuopen':'win9x_rollover',

				'items':{
					'top':0,
					'left':130,

					'background-item':{
						'width':203, 'height':153,
						'left':0, 'top': 2,
						'class':'container'
					},

					1:{
						'content':'Any <b>H</b><u>T</u><i>M</i><s>L</s> can be used in items, such as lists and graphics:<ul><li>one</li><li><img src="../WebDDM.gif" /></li></ul>',
						'content_rollover':'Dynamically change content at any time!',
						'width':200, 'height':150,
						'offsetLeft':1, 'offsetTop': 1,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					}
				}
			},
			3:{
				'content':'JavaScript Calls &nbsp; <img src="../menus/context/arrow.gif" />',
				'content_menuopen':'JavaScript Calls &nbsp; <img src="../menus/context/arrowover.gif" />',
				'url':'index.html',
				'width':130, 'height':20,
				'offsetLeft':0, 'offsetTop':20,
				'class':'win9x_off',
				'class_menuopen':'win9x_rollover',

				'items':{
					'top':0,
					'left':130,

					'background-item':{
						'width':133, 'height':63,
						'left':0, 'top':1,
						'class':'container'
					},

					1:{
						'content':'<a href="javascript:alert(\'Hello world!\');">Alert box</a>',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetLeft':1, 'offsetTop':1,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					},
					2:{
						'content':'<a href="javascript:void confirm(\'You wanna confirm or what?\');">Confirm box',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetTop':20,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					},
					3:{
						'content':'<a href="javascript:void window.open(\'../index.html\')">Open window</a>',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetTop':20,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					}
				}
			}
		}
	};

	// Activate and build menu
	var WebDDM_menu = new WebDDM('menu', menu);
	
	// Activate and build another context menu
	// This one opens with rolling over an image
	// Begin base menu
	var menu = {
		'position':'relative',
		'top':0,
		'left':0,
		'width':500,
		'height':30,
		'expand_menu':'context(rollover,webddmImage)',
		'contract_menu':'rollout',

		'items':{
			'top':0,
			'left':0,

			'background-item':{
				'width':333, 'height':23,
				'left': 0, 'top': 0,
				'class':'container'
			},

			1:{
				'content':'<a href="../index.html">Home</a>',
				'cursor':'hand',
				'width':100, 'height':20, 'offsetLeft':1, 'offsetTop':1,
				'class':'win9x_off',
				'class_rollover':'win9x_rollover'
			},
			2:{
				'content':'<a href="../index.html">More Info &nbsp; <img src="../menus/win9x/arrow.gif" /></a>',
				'content_menuopen':'<a href="../index.html">More Info &nbsp; <img src="../menus/win9x/arrowover.gif" /></a>',
				'width':100, 'height':20,
				'offsetLeft':100,
				'class':'win9x_off',
				'class_menuopen':'win9x_rollover',

				'items':{
					'top':18,
					'left':0,

					'background-item':{
						'width':203, 'height':153,
						'left':0, 'top': 2,
						'class':'container'
					},

					1:{
						'content':'Any <b>H</b><u>T</u><i>M</i><s>L</s> can be used in items, such as lists and graphics:<ul><li>one</li><li><img src="../WebDDM.gif" /></li></ul>',
						'content_rollover':'Dynamically change content at any time!',
						'width':200, 'height':150,
						'offsetLeft':1, 'offsetTop': 1,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					}
				}
			},
			3:{
				'content':'JavaScript Calls &nbsp; <img src="../menus/win9x/arrow.gif" />',
				'content_menuopen':'JavaScript Calls &nbsp; <img src="../menus/win9x/arrowover.gif" />',
				'url':'index.html',
				'width':130, 'height':20,
				'offsetLeft':100,
				'class':'win9x_off',
				'class_menuopen':'win9x_rollover',

				'items':{
					'top':18,
					'left':0,

					'background-item':{
						'width':133, 'height':63,
						'left':0, 'top':1,
						'class':'container'
					},

					1:{
						'content':'<a href="javascript:alert(\'Hello world!\');">Alert box</a>',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetLeft':1, 'offsetTop':1,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					},
					2:{
						'content':'<a href="javascript:void confirm(\'You wanna confirm or what?\');">Confirm box',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetTop':20,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					},
					3:{
						'content':'<a href="javascript:void window.open(\'../index.html\')">Open window</a>',
						'cursor':'hand',
						'width':130, 'height':20,
						'offsetTop':20,
						'class':'win9x_off',
						'class_rollover':'win9x_rollover'
					}
				}
			}
		}
	};
	// End menu

	// Build it	
	// NOTICE that the "rolloverContextMenu" container does NOT
	// exist so WebDDM automatically creates it
	var rolloverMenu = new WebDDM('rolloverContextMenu', menu);
}