//***************************************************代码区域******
$(function(){
	$(".nTab").tab({
		myBtn : ".nBtn",			//选项卡标题区域Class
		myCont : ".nCont"			//选项卡内容区域Class
	});
	$(".nTab2").tab({
		myBtn : ".nBtn2",			//选项卡标题区域Class
		myCont : ".nCont2"			//选项卡内容区域Class
	});

	$(".nTab3").tab({
		myBtn : ".nBtn3",			//选项卡标题区域Class
		myCont : ".nCont3"			//选项卡内容区域Class
	});
	$(".nTab4").tab({
		myBtn : ".nBtn4",			//选项卡标题区域Class
		myCont : ".nCont4"			//选项卡内容区域Class
	});

});

/* 
* tab 选项卡
* Copyright (c) 2015 ZhibinPu
* Date: 2015-8-6
* jquery-1.11.1.min.js
* 使用方法：
	加载jquery库
	加载本插件
*/ 
(function($){ 
	$.fn.tab = function(options){

		var defaults = {
			myBtn : "",		//选项卡标题区域Class
			myCont : ""		//选项卡内容区域Class
		}

		var options = $.extend(defaults, options);

		var $this = this;
		var $btns = this.find(options.myBtn);
		var $conts = this.find(options.myCont);
		
		$btns.removeClass("normal").addClass("normal");
		$conts.removeClass("normal").addClass("normal");
		$btns.eq(0).removeClass("normal").addClass("active");
		$conts.eq(0).removeClass("normal").addClass("active");

		$btns.mousedown(function(){
			$btns.removeClass("active").addClass("normal");
			$conts.removeClass("active").addClass("normal");
			$(this).removeClass("normal").addClass("active");
			var i = $(this).index();
			$conts.eq(i).removeClass("normal").addClass("active");
		});

	}

})(jQuery);