diff --git a/README.md b/README.md index 34c446f..43351ec 100644 --- a/README.md +++ b/README.md @@ -1,3 +1 @@ -__Gradients are pretty magic!__ - -Lets you stare at passing clouds. \ No newline at end of file +__Lets you stare at passing clouds.__ \ No newline at end of file diff --git a/sky.js b/sky.js index f8130b8..1f05e21 100644 --- a/sky.js +++ b/sky.js @@ -11,16 +11,14 @@ canvas.height = window.innerHeight; }; - let i = 0, di = 1, - step = function () { - if ((i < 1000 && di > 0) || (i > 0 && di < 0)) { - i += di; - canvas.style.background = 'linear-gradient(' + i + 'deg, white , rgb(20,56,200))'; - } else { - di = -di; - } - setTimeout(step, 150); + let start_timestamp = 0, angle = 0, + step = function (timestamp) { + angle = ((timestamp - start_timestamp) / 100) % 360; + + canvas.style.background = 'linear-gradient(' + angle + 'deg, white , rgb(20,56,200))'; + + requestAnimationFrame(step); }; - step(); + requestAnimationFrame(step); })() \ No newline at end of file