(function($){
	var items;
	var width;
	var it;
	var next=0;
	var t, td, tc;
	var args = {
		interval: 4000,
		animation: 900
	};

	function slide(i) { $(td).animate({'left':-1 * i * width}, args.animation); };

	function showdot(i) {
		$(tc).find('a').removeClass('active');
		$(tc).find('a:nth-child('+(i+1)+')').addClass('active');
	};

	function show(i) {
		i = i * 1;
		clearInterval(it);
		showdot(i);
		slide(i);
		it = setInterval(function(){
			i++;
			if (i==items) i=0;
			showdot(i);
			slide(i);
		}, args.interval);
	};
	
	$.fn.hslide = function(o){
		$.extend(args, o);
		t = this;
		$(t).css({position: 'relative', overflow: 'hidden'});

		width = $(this).width();
		height = $(this).height();
		items = $(this).children('div').length;

		$(t).children('div').wrapAll('<div></div>');
		td = $(this).children('div').first().css({position:'absolute', width: width * items});
		$(td).children('div').css({width: width, height: height, overflow:'hidden', 'float': 'left', padding: 0, margin: 0});

		tc = $('<span class="clicker"></span>').prependTo(t).css({position: 'absolute',right:'10px',bottom:'10px','z-index':1000});
		for (var j=0;j< items ;j++ ) {
			$('<a rel="'+j+'"></a>').click(function(){
				show($(this).attr('rel'));
			}).appendTo(tc);
		}
		$(tc).find('a').css({cursor:'pointer','float':'left'});
		show(0);
	};

})(jQuery);


