$(document).ready(function() { 

	// default Explore Bar section title
    var textExploreSection = $("[id$='_lblExploreSectionHeader']").html();

    // enable tooltip for "explore_1" element. use the "fade" effect 
    $("#explore_1").tooltip({ 
    relative: true,
    position: 'top left',
    offset: [2, 130],
    effect: 'toggle',
	onBeforeShow: function() {
		exploreOnBeforeShow(1);
		},
	onBeforeHide: function() {
		$("#boxExploreSection2").text(textExploreSection);
		},
	onHide: function() {
		//this.getTrigger().removeClass("active");
		$('#explore_1').removeClass('exploreActive');
		}
    });
    
	$("#explore_2").tooltip({ 
	relative: true,
    position: 'top left',
    offset: [2, 130],
	effect: 'toggle',
	onBeforeShow: function() {
		exploreOnBeforeShow(2);
		},
	onBeforeHide: function() {
		$("#boxExploreSection2").text(textExploreSection);
		},
	onHide: function() {
		//this.getTrigger().removeClass("active");
		$('#explore_2').removeClass('exploreActive');
		}
	});
	
	$("#explore_3").tooltip({ 
	relative: true,
    position: 'top left',
    offset: [2, 130],
	effect: 'toggle',
	onBeforeShow: function() {
		exploreOnBeforeShow(3);
		},
	onBeforeHide: function() {
		$("#boxExploreSection2").text(textExploreSection);
		},
	onHide: function() {
		//this.getTrigger().removeClass("active");
		$('#explore_3').removeClass('exploreActive');
		}
	});  
	
	$("#explore_4").tooltip({ 
	relative: true,
    position: 'top left',
    offset: [2, 130],
	effect: 'toggle',
	onBeforeShow: function() {
		exploreOnBeforeShow(4);
		},
	onBeforeHide: function() {
		$("#boxExploreSection2").text(textExploreSection);
		},
	onHide: function() {
		//this.getTrigger().removeClass("active");
		$('#explore_4').removeClass('exploreActive');
		}
	});  
	
	$("#explore_5").tooltip({ 
	relative: true,
    position: 'top left',
    offset: [2, 130],
	effect: 'toggle',
	onBeforeShow: function() {
		exploreOnBeforeShow(5);
		},
	onBeforeHide: function() {
		$("#boxExploreSection2").text(textExploreSection);
		},
	onHide: function() {
		//this.getTrigger().removeClass("active");
		$('#explore_5').removeClass('exploreActive');
		}
	});  
	
});

var sExploreText1 = new Array();
function exploreOnBeforeShow(iWhich) {
	$('#explore_'+iWhich).addClass('exploreActive');
	if (sExploreText1[iWhich]) $("#boxExploreSection2").text(sExploreText1[iWhich]);
}