1342316-1.html (530B)
1 <!doctype html> 2 <html class="reftest-wait"> 3 <title>calc() in translate3d as base style of transform animation</title> 4 <style> 5 #target { 6 width: 100px; height: 100px; 7 background: blue; 8 animation: anim 1s; 9 transform: translate3d(100px, calc(10px + 30%), 10px); 10 } 11 @keyframes anim { 12 to { transform: translate3d(0px, 0px, 0px); } 13 } 14 </style> 15 <div id="target"></div> 16 <script> 17 document.getElementById("target").addEventListener("animationstart", () => { 18 document.documentElement.classList.remove("reftest-wait"); 19 }); 20 </script>