// animation time: 
var ChangeBannerInterval = 10000;	// auto change interval
var ChangeAnamationSpeed = 700;		// speed of animation change 

var curBannItem = 0;
var lastBannItem = 0;
$(document).ready(function() {
	$('.content_banner').append('<div class="bann_item"></div><div class="banner_item_img"></div>\
		<div class="bann_pagenav"></div>');
	var bann_list = '';
	$('.list_item li').each(function(index){
		lastBannItem = index;
		if(index==0) {actLnk='active';}
		else {actLnk=''; $(this).slideUp(0); }
		bann_list = bann_list + '<a href="javascript:;" class="'+actLnk+'">'+(index+1)+'</a>';
	});
	$('.bann_pagenav').html(bann_list);	
	$('.bann_pagenav a').click(function(){
		curBannItem = Number($(this).text())-1;
		preChangeBanner();
	});
	
	autoChange = setInterval(function(){changeBannerAuto();},ChangeBannerInterval);
});
function preChangeBanner(){
	prevBann = Number($('.bann_pagenav a.active').text())-1;
	$('.bann_pagenav a.active').removeClass('active');
	$('.bann_pagenav a').eq(curBannItem).addClass('active');
	if(curBannItem > prevBann) {
		$('.list_item li').eq(prevBann).animate({
		marginLeft: -618},ChangeAnamationSpeed);
		$('.list_item li').eq(curBannItem).animate({
		marginLeft: 618},0).show().animate({
		marginLeft: 0},ChangeAnamationSpeed);
	}
	if (curBannItem < prevBann) {
		$('.list_item li').eq(prevBann).animate({
		marginLeft: 618},ChangeAnamationSpeed);
		$('.list_item li').eq(curBannItem).animate({
		marginLeft: -618},0).show().animate({
		marginLeft: 0},ChangeAnamationSpeed);												   
	}
	clearInterval(autoChange);
	autoChange = setInterval(function(){changeBannerAuto();},ChangeBannerInterval);
}

function changeBannerAuto(){
	curBannItem < lastBannItem ? curBannItem++ : curBannItem=0;
	preChangeBanner();
};