content-with-overflow-zoomed-ref.html (621B)
1 <!DOCTYPE html> 2 <title>View transitions: shared element with overflow (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 .target { 7 width: 80px; 8 height: 80px; 9 background: blue; 10 view-transition-name: target; 11 zoom: 1.5; 12 border: 2px solid black; 13 } 14 .child { 15 width: 200px; 16 height: 200px; 17 position: relative; 18 top: 50px; 19 left: 50px; 20 background: green; 21 zoom: 1.2; 22 } 23 body { background: lightpink; } 24 </style> 25 26 <div class=ancestor> 27 <div class=target> 28 <div class=child> 29 </div> 30 </div> 31 </div>