overlay-transition-backdrop-entry.html (670B)
1 <!DOCTYPE html> 2 <title>CSS Position Test: overlay transition with ::backdrop during entry animation</title> 3 <link rel="help" href="https://drafts.csswg.org/css-position-4/#overlay"> 4 <link rel="match" href="green-ref.html"> 5 <link rel="author" href="mailto:jarhar@chromium.org"> 6 <style> 7 body { 8 background-color: green; 9 } 10 [popover] { 11 display: block; 12 visibility: hidden; 13 transition-delay: 2s; 14 transition-property: overlay; 15 transition-duration: 2s; 16 transition-behavior: allow-discrete; 17 } 18 [popover]::backdrop { 19 background-color: blue; 20 } 21 </style> 22 <div popover id="foo"></div> 23 <script> 24 foo.offsetTop; 25 foo.showPopover(); 26 </script>