jquery.fn.loadthumb = function(options) {

	options = $.extend({

		 src : ""

	},options);

	var _self = this;

	_self.hide();

	var img = new image();

	$(img).load(function(){

		_self.attr("src", options.src);

		_self.fadein("slow");

	}).attr("src", options.src);  //.atte("src",options.src)要放在load后面，

	return _self;

}



$(function(){

  var i = 5;  //已知显示的<a>元素的个数

  var m = 5;  //用于计算的变量

  var $content = $("#myimagesslidebox .scrollablediv");

  if($content==null) return;

  var count = $content.find("a").length;//总共的<a>元素的个数

  //下一张

  $(".next").on("click",function(){

		var $scrollablediv = $(this).siblings(".items").find(".scrollablediv");

		if( !$scrollablediv.is(":animated")){  //判断元素是否正处于动画，如果不处于动画状态，则追加动画。

			if(m<count){  //判断 i 是否小于总的个数

				m++;

				$scrollablediv.animate({left: "-=50px"}, 600);				

				}

				var act_now = $(".scrollablediv").find(".active").index();

				//if(act_now >= count)return false;

				var nexteq = $(".scrollablediv a").eq(act_now+1);

				//if(nexteq){

					var src = nexteq.find("img").attr("imgb");

					var bigimgsrc = nexteq.find("img").attr("bigimg");

					nexteq.parents(".myimagesslidebox").find(".myimgs").loadthumb({src:src}).attr("bigimg",bigimgsrc);

			

					nexteq.addclass("active").siblings().removeclass("active");

					return false;

			    //}

		}

		return false;

  });

   //上一张

  $(".prev").on("click",function(){

		var $scrollablediv = $(this).siblings(".items").find(".scrollablediv");

		if( !$scrollablediv.is(":animated")){

			if(m>i){ //判断 i 是否小于总的个数

				m--;

				$scrollablediv.animate({left: "+=50px"}, 600);

			}

			var act_now = $(".scrollablediv").find(".active").index();

			if(act_now==0)return false;

			var preveq = $(".scrollablediv a").eq(act_now-1);

			//if(preveq){

				var src = preveq.find("img").attr("imgb");

				var bigimgsrc = preveq.find("img").attr("bigimg");

				preveq.parents(".myimagesslidebox").find(".myimgs").loadthumb({src:src}).attr("bigimg",bigimgsrc);

		

				preveq.addclass("active").siblings().removeclass("active");

				return false;

			//}

		}

		return false;

  });



  $(".scrollablediv a").on("click",function(){

		var src = $(this).find("img").attr("imgb");

		var bigimgsrc = $(this).find("img").attr("bigimg");

		$(this).parents(".myimagesslidebox").find(".myimgs").loadthumb({src:src}).attr("bigimg",bigimgsrc);



		$(this).addclass("active").siblings().removeclass("active");

		return false;

  });

  $(".scrollablediv a:nth-child(1)").trigger("click");

})