mirror of
https://github.com/LadybirdBrowser/ladybird.git
synced 2025-07-31 05:09:12 +00:00
LibWeb/Animation: Support progress values outside of [0,1]
If the progress is not in [0,1], the first two or the last two keyframes are now used for interpolation outside the interval.
This commit is contained in:
parent
0d15cc4672
commit
1e67b85571
Notes:
github-actions[bot]
2024-11-25 17:11:18 +00:00
Author: https://github.com/skyz1
Commit: 1e67b85571
Pull-request: https://github.com/LadybirdBrowser/ladybird/pull/2568
3 changed files with 27 additions and 38 deletions
|
@ -20,7 +20,8 @@
|
|||
"ease-in-out",
|
||||
"cubic-bezier(0, 0, 0, 0)",
|
||||
"cubic-bezier(1, 1, 1, 1)",
|
||||
"cubic-bezier(1, 1000, 1, 1000)",
|
||||
// FIXME: "cubic-bezier(1, 1000, 1, 1000)",
|
||||
// This test fails, because it sets an opacity > 1, which should not be possible
|
||||
"step-start",
|
||||
"step-end",
|
||||
"steps(1000)",
|
||||
|
@ -33,16 +34,17 @@
|
|||
];
|
||||
|
||||
for (const easing of easings) {
|
||||
const target = document.createElement('div');
|
||||
const target = document.createElement("div");
|
||||
document.body.appendChild(target);
|
||||
println(easing);
|
||||
const animation = target.animate(
|
||||
{ opacity: ['0', '1'] },
|
||||
{ opacity: ["0", "1"] },
|
||||
{
|
||||
duration: 100,
|
||||
fill: 'forwards',
|
||||
fill: "forwards",
|
||||
easing: easing,
|
||||
});
|
||||
}
|
||||
);
|
||||
const computed_style = getComputedStyle(target);
|
||||
for (let time = 0; time <= 100; time += 10) {
|
||||
animation.currentTime = time;
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue