JavaScriptの、requestAnimationFrame()かsetInterval()を使ったアニメーション関数。迚も好く使う割に、クソの塊である"vendor-prefix"の所為で無駄に長いので、書き出しておく。
/** * ex.) * var stop, i = 1000; * stop = animate(function () { * --i; * if (i <= 0) { stop(); } * }); * @param {function()} callback * @return {function()} Stop animation function. */ function animate (callback) { var timerID, stop, requestAnimationFrame, cancelRequestAnimationFrame, isStopped = false; function animationFun () { if (isStopped) { return; } context.clearRect(0, 0, width, height); callback(); if (requestAnimationFrame) { timerID = requestAnimationFrame(animationFun); } } if (window.requestAnimationFrame && window.cancelAnimationFrame) { requestAnimationFrame = window.requestAnimationFrame; cancelAnimationFrame = window.cancelAnimationFrame; } else if (window.mozRequestAnimationFrame && window.mozCancelAnimationFrame) { requestAnimationFrame = window.mozRequestAnimationFrame; cancelAnimationFrame = window.mozCancelAnimationFrame; } else if (window.msRequestAnimationFrame && window.msCancelAnimationFrame) { requestAnimationFrame = window.msRequestAnimationFrame; cancelAnimationFrame = window.msCancelAnimationFrame; } else if (window.webkitRequestAnimationFrame && window.webkitCancelAnimationFrame) { requestAnimationFrame = window.webkitRequestAnimationFrame; cancelAnimationFrame = window.webkitCancelAnimationFrame; } else if (window.oRequestAnimationFrame && window.oCancelAnimationFrame) { requestAnimationFrame = window.oRequestAnimationFrame; cancelAnimationFrame = window.oCancelAnimationFrame; } if (requestAnimationFrame) { timerID = requestAnimationFrame(animationFun); stop = function () { isStopped = true; cancelAnimationFrame(timerID); }; } else { timerID = setInterval(animationFun, 16); stop = function () { clearInterval(timerID); }; } return stop; }