request animation framne
This commit is contained in:
parent
57498704b7
commit
bce4ff7a92
2 changed files with 9 additions and 13 deletions
|
|
@ -1,3 +1 @@
|
||||||
__Gradients are pretty magic!__
|
__Lets you stare at passing clouds.__
|
||||||
|
|
||||||
Lets you stare at passing clouds.
|
|
||||||
18
sky.js
18
sky.js
|
|
@ -11,16 +11,14 @@
|
||||||
canvas.height = window.innerHeight;
|
canvas.height = window.innerHeight;
|
||||||
};
|
};
|
||||||
|
|
||||||
let i = 0, di = 1,
|
let start_timestamp = 0, angle = 0,
|
||||||
step = function () {
|
step = function (timestamp) {
|
||||||
if ((i < 1000 && di > 0) || (i > 0 && di < 0)) {
|
angle = ((timestamp - start_timestamp) / 100) % 360;
|
||||||
i += di;
|
|
||||||
canvas.style.background = 'linear-gradient(' + i + 'deg, white , rgb(20,56,200))';
|
canvas.style.background = 'linear-gradient(' + angle + 'deg, white , rgb(20,56,200))';
|
||||||
} else {
|
|
||||||
di = -di;
|
requestAnimationFrame(step);
|
||||||
}
|
|
||||||
setTimeout(step, 150);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
step();
|
requestAnimationFrame(step);
|
||||||
})()
|
})()
|
||||||
Loading…
Add table
Reference in a new issue