animation-with-delay-crash.html (745B)
1 <!DOCTYPE html> 2 <link rel="help" href="https://drafts.csswg.org/web-animations-1/#the-effecttiming-dictionaries"> 3 <style> 4 .scroller { 5 overflow: auto; 6 height: 100px; 7 width: 100px; 8 will-change: transform; 9 } 10 11 .contents { 12 height: 1000px; 13 width: 100%; 14 } 15 </style> 16 <div class="scroller"> 17 <div class="contents"></div> 18 </div> 19 <script> 20 // Test passes if it does not crash. 21 // Scroll timeline animations are progress-based and not compatible with 22 // delays specified in milliseconds. 23 const timeline = new ScrollTimeline(); 24 const options = { 25 timeline: timeline, 26 endDelay: 200 27 }; 28 const keyframes = { opacity: [0, 1]}; 29 const element = document.querySelector('.contents'); 30 element.animate(keyframes, options); 31 </script>