﻿var sone;
var stwo;
var sthree;
var small1 = new Image();
small1.src = "./img/visual/s1.jpg";
var small2 = new Image();
small2.src = "./img/visual/s2.jpg";
var small3 = new Image();
small3.src = "./img/visual/s3.jpg";
var big1 = new Image();
big1.src = "./img/visual/b1.jpg";
var big2 = new Image();
big2.src = "./img/visual/b2.jpg";
var big3 = new Image();
big3.src = "./img/visual/b3.jpg";

window.onload = init;
function init() {

	document.getElementById("sone").onmouseover = getfirstImage;
	document.getElementById("sone").onmouseout = getsecondImage;
	document.getElementById("sthree").onmouseover = getthirdImage;
	document.getElementById("sthree").onmouseout = getsecondImage;


	sone= document.getElementById("sone");
	stwo= document.getElementById("stwo");
	sthree= document.getElementById("sthree");

	img1= document.getElementById("img1");
	img2= document.getElementById("img2");
	img3= document.getElementById("img3");

	//最初のイメージを表示
	getsecondImage;
}

//big1
function getfirstImage() {
	img1.style.left = "18px";
	img1.style.top = "3px";
	img2.style.left ="343px";
	img2.style.top = "47px";
	img3.style.right = "24px";
	img3.style.top = "47px";
	sone.src = big1.src;
	stwo.src = small2.src;
	sthree.src = small3.src
}

//big2
function getsecondImage() {
	img1.style.left = "24px";
	img1.style.top = "47px";
	img2.style.left ="296px";
	img2.style.top = "3px";
	img3.style.right = "24px";
	img3.style.top = "47px";
	sone.src = small1.src;
	stwo.src = big2.src;
	sthree.src = small3.src;
}
//big3
function getthirdImage() {
	sone.src = small1.src;
	stwo.src = small2.src;
	sthree.src = big3.src;
	img1.style.left = "24px";
	img1.style.top = "47px";
	img2.style.left ="296px";
	img2.style.top = "47px";
	img3.style.right = "18px";
	img3.style.top = "3px";

}
