blob: fccfade1cc09207f7db0c6faf7fe656d83f9b120 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
|
<!DOCTYPE html>
<html class="reftest-wait">
<style>
@keyframes anim {
0% { background-color: red; }
100% { background-color: red; }
}
#target.x::before,
#target.y::before {
content: "";
position: absolute;
width: 100px;
height: 100px;
}
#target.x::before {
animation: anim 100s infinite;
}
</style>
<div id="target"></div>
<script>
var target = document.getElementById('target');
requestAnimationFrame(() => {
// Create ::before, start animation
target.className = 'x';
requestAnimationFrame(() => {
// Remove ::before, stop animation
target.className = '';
requestAnimationFrame(() => {
// Create ::before, should not be animating
target.className = 'y';
document.documentElement.classList.remove('reftest-wait');
});
});
});
</script>
|
