sibling-frames-transition-ref.html (686B)
1 <!DOCTYPE html> 2 <title>View transitions: main frame and sibling frames transition at the same time (ref)</title> 3 <link rel="help" href="https://drafts.csswg.org/css-view-transitions-1/"> 4 <link rel="author" href="mailto:khushalsagar@chromium.org"> 5 <style> 6 body { 7 background: green; 8 } 9 10 #first { 11 position: fixed; 12 top: 0; 13 left: 0; 14 width: 50vw; 15 height: 50vh; 16 } 17 18 #second { 19 position: fixed; 20 top: 50vh; 21 left: 0; 22 width: 50vw; 23 height: 50vh; 24 } 25 </style> 26 27 <iframe id="first" srcdoc=" 28 <style> 29 body { 30 background: lightblue; 31 } 32 </style> 33 <body></body>"></iframe> 34 <iframe id="second" srcdoc=" 35 <style> 36 body { 37 background: magenta; 38 } 39 </style> 40 <body></body>"></iframe>