kitagata_old/js/slideme.js

//変数を定義
var num = 0;
var navi_num = 0;
var maxnum = 0;
var item_current = 0;
var slide_num = 0;
var item_n = 0;
var item_next = 1;
var item_preview = 0;
var interval;
var flug = 0;

//関数を定義
//次のアイテムを出力する
function next_show() {
	if(item_current == maxnum){
		item_n = maxnum;
		item_next = 0;
		item_current = 0;
	} else {
		item_n = item_current;
		item_next = item_current + 1;
		item_current ++;
	}
	
	nextprev();
	paging_current();
	
	//slide_list[item_n].style.cssText = "opacity:0;";
	$('#item' + item_next).css("opacity",0);
}

//前のアイテムを出力する
function preview_show() {
	if(item_current === 0){
		item_n = maxnum;
		item_preview = maxnum;
		item_current = 0;
	} else {
		item_n = item_current;
		item_preview = item_current - 1;
		item_current --;
	}
	
	nextprev();
	paging_current();
	
	$('#item' + item_preview).css("opacity",0);
}

//アイテムをスライドさせる
function item_slide_nxt() {
	$('#item' + item_current).css("display","none");
	$('#item' + item_current).css("left","0px");
	$('#item'+item_current).animate({
		"left":"-30px",
		"opacity":"0"
	}, 500, function(){
		$('#item' + item_current).css("left","0px");
		$('#item' + item_current).css("display","none");
	});
	
	next_show();
	
	$('#item' + item_next).css("display","block");
	$('#item' + item_next).css("left","30px");
	$('#item' + item_next).animate({
		"left":"0",
		"opacity":"1"
	}, 500, function(){
		$('#item' + item_next).css("display","block");
		flug = 0;
	});
}

function item_slide_prv() {
	$('#item' + item_current).css("display","none");
	$('#item' + item_current).css("left","0px");
	$('#item' + item_current).animate({
		"left":"30px",
		"opacity":"0"
	}, 500, function(){
		$('#item' + item_current).css("left","0px");
		$('#item' + item_current).css("display","none");
	});
	
	preview_show();
	
	$('#item' + item_preview).css("display","block");
	$('#item' + item_preview).css("left","-30px");
	$('#item' + item_preview).animate({
		"left":"0",
		"opacity":"1"
	}, 500, function(){
		$('#item' + item_preview).css("display","block");
		flug = 0;
	});
}

//指定の番号のアイテムを出力する
function num_show(i) {
	return function(ev) {
		if (item_current != i) {
			item_n = item_current;
			//表示していたアイテムを消す
			$('#item' + item_n).css("display","none");
			$('#item' + item_n).css("left","0px");
			$('#item' + item_n).animate({
				"opacity":"0"
			}, 500, function(){
				$('#item' + item_n).css("display","none");
			});
			
			item_current = i;
			
			//選択されたアイテムを表示する
			$('#item' + item_current).css("display","block");
			$('#item' + item_current).css("left","0px");
			$('#item' + item_current).animate({
				"opacity":"1"
			} ,500, function(){
				$('#item' + item_current).css("display","block");
			});
			
			nextprev();
			paging_current();
			clear();
		}
	}
}

//進む戻る表示非表示
function nextprev() {
	if (item_current === 0) {
		next.style.display = "block";
		prev.style.display = "none";
	} else if (item_current == maxnum) {
		next.style.display = "none";
		prev.style.display = "block";
	} else {
		next.style.display = "block";
		prev.style.display = "block";
	}
}

//clearInterval用
function clear(){
	clearInterval(interval);
	interval = setInterval('item_slide_nxt()', 6000);
}

//ページングの現在位置を設定する
function paging_current () {
	for(var j = 0; j < list.length; j++){
		if (j == item_current) {
			navi_list[item_current].src = "css/img/on.png";
		} else {
			navi_list[j].src = "css/img/off.png";
		}
	}
}

//初期化
function slideme() {
	var slide = document.getElementById("slide");
	var childs = slide.getElementsByTagName("div");
	num = 0;
	navi_num = 0;
	maxnum = childs.length - 1;
	item_current = 0;
	list = new Array();
	navi_list = new Array();
	slide_list = new Array();
	
	next = document.getElementById("next_move");
	prev = document.getElementById("prev_move");
	
	nextprev();
	
	//自動遷移
	interval = setInterval('item_slide_nxt()', 6000);
	
	next.addEventListener('click', function(event) {
		if (flug == 0) {
			flug = 1;
			item_slide_nxt();
			clear();
		}
	}, false);
	prev.addEventListener('click', function(event) {
		if (flug == 0) {
			flug = 1;
			item_slide_prv();
			clear();
		}
	}, false);
	
	for(var i = 0; i < childs.length; i++){
		num = "itemnum" + i;
		navi_num = "navi_item" + i;
		slide_num = "item" + i;
		list[i] = document.getElementById(num);
		navi_list[i] = document.getElementById(navi_num);
		slide_list[i] = document.getElementById(slide_num);
		
		list[i].addEventListener('click', num_show(i), false);
		if (i != 0) {
			$('#'+slide_num).css("opacity",0);
			$('#'+slide_num).css("display","none");
		}
		$('#item0').css("opacity",1);
		$('#item0').css("display","block");
	}
}

//初期化 ie8
function slideme_ie8() {
	var slide = document.getElementById("slide");
	var childs = slide.getElementsByTagName("div");
	num = 0;
	navi_num = 0;
	maxnum = childs.length - 1;
	item_current = 0;
	list = new Array();
	navi_list = new Array();
	slide_list = new Array();
	
	next = document.getElementById('next_move');
	prev = document.getElementById('prev_move');
	
	//自動遷移
	interval = setInterval('item_slide_nxt()', 6000);
	
	next.attachEvent('onclick', function(event) {
		item_slide_nxt();
		clear();
	}, false);
	prev.attachEvent('onclick', function(event) {
		item_slide_prv();
		clear();
	}, false);
	
	for(var i = 0; i < childs.length; i++){
		num = "itemnum" + i;
		navi_num = "navi_item" + i;
		slide_num = "item" + i;
		list[i] = document.getElementById(num);
		navi_list[i] = document.getElementById(navi_num);
		slide_list[i] = document.getElementById(slide_num);
		
		list[i].attachEvent('onclick', num_show(i), false);
		if (i != 0) {
			$('#'+slide_num).css("opacity",0);
			$('#'+slide_num).css("display","none");
		}
		$('#item0').css("opacity",1);
		$('#item0').css("display","block");
	}
}