$(function() {
	$('body').append('<div id="background"></div>');
	var bg = $('#background');
	//全体の高さがbodyより大きかったらbgを全体の高さにする
	if ($('#wrap').outerHeight(true) > $('body').outerHeight(true)) {
		bg.height($('#wrap').outerHeight(true));
	}
	bg.css({'opacity': 0});
	var imgWidth = 5020;
	var imgHeight = 4016;
	$('.button a').hover(function(e){
		var x = $(this).offset().left  - (imgWidth/2) +  ($(this).width()/2);
		var y = $(this).offset().top - (imgHeight/2) +  ($(this).height()/2);
		var bgPos = bg.css('backgroundPosition');
		//IEとそれ以外で条件分岐
		if (bgPos) {
			bg.css({
				'background-position': x+ 'px ' + y + 'px'
			});
		} else {
			bg.css({
				'background-position-x': x+ 'px',
				'background-position-y': y + 'px'
			});
		}
		bg.stop().animate({opacity: 1},500);
		
	}, function() {
		bg.stop().animate({opacity: 0},500);
	});
});