Tab contents useing hash

jQuery(function(){
	var url_hash=location.hash;//get hash
	var target_elm=jQuery('.tabPanel').eq(0);//get first .tabPanel
	jQuery('.tabPanel').hide();//hide all .tabPanel
	if(jQuery(url_hash).hasClass('tabPanel')) {//if a hash element has class '.tabPanel'... 
		target_elm=jQuery(url_hash);//get current hash
		var ind=jQuery('.tabPanel').index(jQuery(url_hash));//get current .tabPanel
		jQuery('.tabNavi li').eq(ind).addClass('on').siblings().removeClass('on');//add class 'on' to current .tabPanel and all remove class 'on' sibling elements.
	}
	target_elm.show();//show current hash element
	jQuery('.tabNavi li a').click(function(){//if click the element...
		var ind=jQuery(this).parents('li').index();//get index of parent element
		jQuery(this).parents('li').addClass('on').siblings().removeClass('on');//add class 'on' the parent element and remove class'on' other sibling elements.
		jQuery(".tabPanel:visible").fadeOut(300,function(){ //hide visible tab panel 
			jQuery('.tabPanel:eq('+ind+')').fadeIn(300);//show tab panel having equal index of tab.
		});
		return false;
	});
});

jQuery

Posted by Nanashi