| 123456789101112131415161718192021222324252627 |
- <!DOCTYPE html>
- <style>
- @keyframes test-animation {
- from {
- transform: translateX(0);
- }
- to {
- transform: translateX(100px);
- }
- }
- .animate {
- animation: test-animation 2s steps(1, jump-none) infinite;
- }
- </style>
- <div class="box animate" style="width: 50px; height: 50px; background-color: red;"></div>
- <script src="../../include.js"></script>
- <script>
- test(() => {
- // Apply animation dynamically to trigger re-computation.
- document.querySelector('.box').classList.add('animate');
- // Log computed style to confirm the animation is parsed and applied correctly.
- const animation = getComputedStyle(document.querySelector('.box')).animationTimingFunction;
- println('Computed animation-timing-function: ' + animation);
- });
- </script>
|
