// the number you pass to initLeft doesn't matter since it will get
	// changed onactivate

	var myMenu1 = new ypSlideOutMenu("menu1", "down", 2, 44, 125, 135) // # of menu items * 19) + 1
	var myMenu2 = new ypSlideOutMenu("menu2", "down", 2, 44, 125, 97) // left, top, width, height
	var myMenu3 = new ypSlideOutMenu("menu3", "down", 2, 44, 135, 154)

	// for each menu, we set up the onactivate event to call repositionMenu with the amount offset from center, in pixels
		myMenu1.onactivate = function() { 
				document.getElementById('menu1').className='active';
				toggleSelect('hide');
		}
		myMenu1.ondeactivate = function() {
				document.getElementById('menu1').className='';
				toggleSelect('show');
		}
		myMenu2.onactivate = function() { 
				document.getElementById('menu2').className='active';
		}
		myMenu2.ondeactivate = function() {
				document.getElementById('menu2').className='';
		}
		myMenu3.onactivate = function() { 
				document.getElementById('menu3').className='active';
		}
		myMenu3.ondeactivate = function() {
				document.getElementById('menu3').className='';
		}

    ypSlideOutMenu.writeCSS();