//preload images for this example
		var img1 = new Image();
		img1.src = "menu/arrow_up_white_20x20.png";
		var img2 = new Image();
		img2.src = "menu/arrow_down_white_20x20.png";
		var img3 = new Image();
		img3.src = "menu/bio.gif";
    
		function wm_3_onGroupOpened(slidingMenuIndex, groupIndex){
			var slidingMenuId = wm_3_getSlidingMenuIdFromIndex(slidingMenuIndex);
			switch (slidingMenuId){ //I recommand always to use a switch inside these eventhandlers (wm_3_onGroupOpened, wm_3_onGroupClosed and wm_3_onPositionChanged), that way it is easy to handle these events for multiple SlidingMenus on the same page as you add them
				case "smRss" :
					var tblHeaderId = "tblHeader_" + (groupIndex + 1);
					var tblHeader = document.getElementById(tblHeaderId);
					tblHeader.className = "menu_title_header_alternate";

					var imgHeaderArrowId = "img_header_arrow_" + (groupIndex + 1);
					var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
					imgHeaderArrow.src = "menu/bio.gif";
					break;
				default :
					break;
			}
		}

		function wm_3_onGroupClosed(slidingMenuIndex, groupIndex){
			var slidingMenuId = wm_3_getSlidingMenuIdFromIndex(slidingMenuIndex);
			switch (slidingMenuId){
				case "smRss" :
					var tblHeaderId = "tblHeader_" + (groupIndex + 1);
					var tblHeader = document.getElementById(tblHeaderId);
					tblHeader.className = "rss_title_header_default";

					var imgHeaderArrowId = "img_header_arrow_" + (groupIndex + 1);
					var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
					var headerPosition = wm_3_getGroupHeaderPositionFromIndex(slidingMenuIndex, groupIndex)
					if (headerPosition == "Top"){
						imgHeaderArrow.src = "menu/arrow_down_orange_20x20.png";
					}
					else { //headerPosition == "Bottom"
						imgHeaderArrow.src = "menu/arrow_up_orange_20x20.png";
					}
					break;
				default :
					break;
			}
		}

		function wm_3_onPositionChanged(slidingMenuIndex, groupIndexes){
			var slidingMenuId = wm_3_getSlidingMenuIdFromIndex(slidingMenuIndex);
			switch (slidingMenuId){
				case "smRss" :
					for (var g = 0; g < groupIndexes.length; g++){
						var imgHeaderArrowId = "img_header_arrow_" + (groupIndexes[g] + 1);
						var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
						imgHeaderArrow.src = "arrow_all_orange_20x20.png";
					
						var headerPosition = wm_3_getGroupHeaderPositionFromIndex(slidingMenuIndex, groupIndexes[g])
						if (headerPosition == "Top"){
							imgHeaderArrow.src = "menu/arrow_down_orange_20x20.png";
						}
						else { //headerPosition == "Bottom"
							imgHeaderArrow.src = "menu/arrow_up_orange_20x20.png";
						}
					}
					break;
				default :
					break;
			}
		}
		
		function Header_OnMouseOver(pstrGroupHeaderId){
			var groupIndex = wm_3_getGroupIndexFromGroupHeaderId(pstrGroupHeaderId);
			var groupIndex = wm_3_getGroupIndexFromGroupHeaderId(pstrGroupHeaderId);
			var slidingMenuIndex = wm_3_getSlidingMenuIndexFromGroupHeaderId(pstrGroupHeaderId);
			var headerPosition = wm_3_getGroupHeaderPositionFromIndex(slidingMenuIndex, groupIndex);
			var groupIsOpen = wm_3_getGroupIsOpenFromIndex(slidingMenuIndex, groupIndex);
			
			if (!groupIsOpen){
				var imgHeaderArrowId = "img_header_arrow_" + (groupIndex + 1);
				var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
					if (headerPosition == "Top"){
						imgHeaderArrow.src = "menu/arrow_down_white_20x20.png";
					}
					else{
						imgHeaderArrow.src = "menu/arrow_up_white_20x20.png";
					}

				var tblHeaderId = "tblHeader_" + (groupIndex + 1);
				var tblHeader = document.getElementById(tblHeaderId);
				tblHeader.className = "menu_title_header_alternate";
			}
		}
	    
		function Header_OnMouseOut(pstrGroupHeaderId){
			var groupIndex = wm_3_getGroupIndexFromGroupHeaderId(pstrGroupHeaderId);
			var slidingMenuIndex = wm_3_getSlidingMenuIndexFromGroupHeaderId(pstrGroupHeaderId);
			var headerPosition = wm_3_getGroupHeaderPositionFromIndex(slidingMenuIndex, groupIndex);
			var groupIsOpen = wm_3_getGroupIsOpenFromIndex(slidingMenuIndex, groupIndex);

			if (!groupIsOpen){
				var imgHeaderArrowId = "img_header_arrow_" + (groupIndex + 1);
				var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
				if (headerPosition == "Top"){
						imgHeaderArrow.src = "menu/arrow_down_orange_20x20.png";
				}
				else{
						imgHeaderArrow.src = "menu/arrow_up_orange_20x20.png";
				}
				var tblHeaderId = "tblHeader_" + (groupIndex + 1);
				var tblHeader = document.getElementById(tblHeaderId);
				tblHeader.className = "rss_title_header_default";
			}
		}

		//InitializeLocal() must be called then browser is finish loading the HTML document, this you can do in the BODY tag of your .aspx-page, eg. <BODY onload="InitializeLocal()" ...>
		function InitializeLocal(){
			//The CSharp code will emit a function OpenRssCustom() if there is no PostBack, thereby open the Choose-Custom-Feed Group of the nested SlidingMenu smRssCustom
			if (typeof(OpenRssCustom) == "function"){
				setTimeout("OpenRssCustom()", 500);
			}
			
			//There is an error in the SlidingMenu Client API that the wm_3_onGroupOpened, wm_3_onGroupClosed and wm_3_onPositionChanged events are not instantiated upon PostBack (see http://www.menulab.com/slidingmenu/errors.aspx).
			//It means that we have to initialize the GUI of an open Group for the Custom Group after PostBack.
			//The SlidingMenu, smRss, is the second SlidingMenu on the SlidingRSS example page, therefore it has slidingMenuIndex = 1 (on your page it will probably have slidingMenuIndex = 0)
			var slidingMenuIndex = 1;
			var groupIndex = 3; //the custom Group inside smRss is Group number 4, so it has groupIndex = 3
			var boolCustomGroupIsOpen = wm_3_getGroupIsOpenFromIndex(slidingMenuIndex, groupIndex);
			if (boolCustomGroupIsOpen){
				//the 6 lines below is identical to the code inside the wm_3_onGroupOpened eventhandler
				var tblHeaderId = "tblHeader_" + (groupIndex + 1);
				var tblHeader = document.getElementById(tblHeaderId);
				tblHeader.className = "menu_title_header_alternate";

				var imgHeaderArrowId = "img_header_arrow_" + (groupIndex + 1);
				var imgHeaderArrow = document.getElementById(imgHeaderArrowId);
				imgHeaderArrow.src = "menu/bio.gif";
			}
		}

