﻿
jQuery.fn.loadthumb = function(options) {
	options = $.extend({
		 src : ""
	},options);
	var _self = this;
	_self.stop(true,true).fadeOut(500);
	var img = new Image();
	$(img).load(function(){
		_self.attr("src", options.src);
		_self.stop(true,true).fadeIn(500);
	}).attr("src", options.src); 
	return _self;
}


$(document).ready(function(){
						   
	 var len  = $("#banner_bt > a").length;
	 var index = 0;
	 var adTimer;
	 $("#banner_bt a").mouseover(function(){
		index  =   $("#banner_bt a").index(this);
		showImg(index);
	 }).eq(0).mouseover();	
	 $('#banner_mid').hover(function(){
			 clearInterval(adTimer);
		 },function(){
			 adTimer = setInterval(function(){
			    index++;
				if(index==len){index=0;}
				showImg(index);				
			  } , 8000);
	 }).trigger("mouseleave");
});

function showImg(index){
		//ͼƬsrc
		var src = ["images/banner.jpg","images/banner1.jpg","images/banner2.jpg","images/banner3.jpg","images/banner4.jpg"];
		//ͼƬԤز
		$("#banner_mid img").loadthumb({src:  src[index] });
		$("#banner_bt a").removeClass("on")
			.eq(index).addClass("on");
}
