var frame = 10;
var fps = 20;

function Animation(obj, e) {
	var n = 1;
	function Callback() {
		if (e == 1) {
			obj.style.backgroundPosition = '0px ' + Math.abs(obj.offsetHeight) * (n - 1) * -1 + 'px';
		} else {
			obj.style.backgroundPosition = '0px ' + Math.abs(obj.offsetHeight) * (frame - n) * -1 + 'px';
		}
		
		if (n != frame) {
			n ++;
			setTimeout(Callback, fps);
		}
	}
	setTimeout(Callback, fps);
}









function AnimatinoButton() {
	var listArray = document.getElementById("animation_button").getElementsByTagName("a");
	for(var i = 0; i < listArray.length; i++) {
		listArray[i].onmouseover = function() {
			this.style.backgroundPosition = '0px 0px';
			Animation(this, 1);
		}
		listArray[i].onmouseout = function() {
			this.style.backgroundPosition = '0px ' + Math.abs(this.offsetHeight) * (frame - 1) * -1 + 'px';
			Animation(this, 0);
		}
	}
}

if(window.addEventListener) {
	window.addEventListener("load", AnimatinoButton, false);
} else if(window.attachEvent) {
	window.attachEvent("onload", AnimatinoButton);
}