/*
$(function() {
	 $("#imagebank .imgList").jCarouselLite({
	btnNext: "#imagebank .next",
	btnPrev: "#imagebank .prev",
	visible: 5,
	scroll: 1,
	speed: 800
	 });
});
*/

/**
 * メインビジュアルの切り替え用
 */
$(document).ready(function() {
	
	// 設定
	var thumb = '#thumb li';   // サムネイルの要素
	var image = '#img h2'      // メイン画像の要素
	var speed = 3000;          // 切り替えのスピード
	var i = 0;                 // デフォルトの表示位置の設定
	var max = $(thumb).length; // 表示要素数の設定
	var fade = 1000;           // クロスフェードのスピード
	//alert(max);
	
	// 最初の処理
	$(image).eq(i).addClass("selected");
	$(image).css({opacity:'0'});
	$(image).eq(i).animate({opacity:'1'},700);
	i++;
	
	// サムネイルをクリックした時のメソッド
	$(thumb).click(function() {
		i = $(this).index(); // クリックされたインデックスを取得
		chengeVisual(i);
	});

	// 画像切り替えるメソッド
	var chengeVisual = function(n) {
		if (n == max) n = 0;
		$(thumb).eq(n).thumbActive();
		$(image).eq(n).foreground();
	}
	// 要素インデックスのカウント
	var counter = function() {
		if (i == max) i = 0; // 要素数を超えたら0に戻す
		chengeVisual(i);
		i++;
	}
	var timer = setInterval(counter, speed);
	
	
	$.fn.extend({
		// サムネイルをアクティブにする
		thumbActive : function() {
			$(this).siblings().removeClass("focus");
			$(this).addClass("focus");
		},
		// 選択されたメイン画像を最前面に持ってくる
		foreground : function() {
			$(this).siblings().removeClass("selected");
			$(this).addClass("selected");
			$(this).siblings().stop();
			$(this).siblings().animate({opacity:'0'},fade);
			$(this).stop();
			$(this).animate({opacity:'1'},fade);
		}
	});
	
});

