// JavaScript Document
var dockOptions =
		{ align: 'middle' // horizontal menu, with expansion DOWN from a fixed TOP edge
		, size: 73 //increase 'at rest' size to 60px ////// 70
		, labels: true  // add labels (defaults to 'br')
		, setLabel: function(txt, i, el){
				//append a clone of the relevant sub-menu to the label, div.jqDockLabel...
				//Note that I don't need to add the inner wrapper - div.jqDockLabelText - 
				//because I can reposition the sub-menus within div.jqDockLabel itself
				$(el).append($('#submenus>li>ul').eq(i).clone(true))
					//...and intercept mousemoves to prevent propagation and stop
					//the dock resizing as the cursor moves over the sub-menus...
					.bind('mousemove', function(){ 
						return false; 
					})
					//put a one-off mouseenter on every sub-menu to (re)set
					//contained anchor widths...
					.find('ul').one('mouseenter', function(){
						$('>li>a', this).each(function(){
								$(this).width($(this).parent().width());
							});
						return false;
					}).end()
					//for this example, put a click handler on every sub-menu anchor
					//that simply toggles a class to change background colour...
					.find('a').click(function(){
						//$(this).toggleClass('clicked');
						//this.blur();
						return false;
					  })

					//put a hover on any sub-menu LI that has a child menu, to show/hide
					//that child menu; and allow mouseleave to propagate up so that coming
					//completely off the sub-menu structure will still collapse the dock...
					.next('ul').parent().hover(function(ev){
						var mLeave = ev.type == 'mouseleave';
						$('>ul', this)[mLeave ? 'hide' : 'show']();
						return mLeave;
					})
					//add a visual indicator that a child menu exists...
					.find('>a').append("<"+"img src='images/submenu.gif' alt='' />");
				return false;
			}
		};
	// ...and apply...