clip-path-svg-invalidate-ref.html (520B)
1 <!doctype html> 2 <html> 3 <title>Clip Path: invalidate composited clip-path via SVG</title> 4 <link rel="author" title="Chris Harrelson" href="mailto:chrishtr@chromium.org"> 5 6 <style> 7 body { 8 margin: 0; 9 } 10 div { 11 height: 500px; 12 background: black; 13 clip-path: url(#clip); 14 will-change: transform; 15 } 16 svg { 17 width: 0; 18 height: 0; 19 } 20 </style> 21 22 <div></div> 23 24 <svg viewBox="0 0 1 1"> 25 <clipPath id="clip" clipPathUnits="objectBoundingBox"> 26 <polygon points="0,0 0.5,1 1,0" /> 27 </clipPath> 28 </svg>