//***************************************************代码区域******
$(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);