﻿
jQuery.fn.jSlider = function(options) {

	var defaults = {};
	var settings = $.extend({}, options, defaults);

	var count=0;
	var slide;
	var done=true;
	
	var index=0;
	
	
	return this.each(function(){
			
		var i = 0, l = null;
		
		//设置第一个图形为selected
		$('.jSlider-List li',this[0])[0].className = 'selected';
		
		//得到轮播图形个数
		count=$('.jSlider-List li',this[0]).length;
		
		//添加分页的li元素
		for (i = 0; i < count; i++){
			l = document.createElement("li");
			l.id = i+1;
 			l.innerHTML = i+1;
			if (i==0) l.className = 'selected';
			settings.target.get(0).appendChild(l);
		}
		
		//轮播第一个图片
		SlideStart($('.jSlider-List li',this[0])[0]);
		
		//绑定li的单击事件
		$('.jSlider-Nav li').bind('click',function() {
			if(done&&!$(this).is('.selected')) {
				Slide($(this).parent().find('>').index(this),this);
			}
		});
		
		
	});
	
	function SlideStop(){
		clearTimeout(slide);
	}
	
	function SlideStart(obj){
		slide=setTimeout(function(){Slide(-1,obj)},3000);
	}
	
	function Slide(ix,obj) {
		if (ix>=0)
			index=ix; 
		else
			index++;

		if (index>count-1) index=0;
		
		SlideStop();
		
		done=false;
		
		var father=$(obj).parents('.jSlider:eq(0)');
		var list=$('.jSlider-List',father);
		var trigger=$('.jSlider-Nav',father);
		var old=$('>.selected',list);
		if(old.length>0) {
			old.css('z-index',10);
			$('>:eq('+index+')',list).addClass('selected').show();
			old.fadeOut(300,function() {	//改fadeOut为hide,slideUp,slideDown等可以换效果，300表示动画时间
				$(this).css('z-index',1).removeClass('selected');
				done=true;
				SlideStart(obj);
			});
			trigger.find('li.selected').removeClass('selected');
			$('>:eq('+index+')',trigger).addClass('selected');
		}
	}

		
}
