clip % mask...

clip % mask...

Doug et al,

what workaround is possible where the "donut" is defined in percentage?
clip uses path and mask does not allow pointer events through the hole.

cheers

Jonathan Chetwynd
Accessibility Consultant on Media Literacy and the Internet

<svg xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
width="100%" height="100%"
 >
<defs>

<symbol id="hole" viewBox="0 0 150 150">
<circle cx="75" cy="75" r="75" />
</symbol>

</defs>

<g stroke="none" >
<rect x="0" y="0" width="100%" height="55%" fill="red" />
<rect x="0" y="55%" width="100%" height="100%" fill="orange" />

<use xlink:href="#hole" x="30%" y="50%" width="10%" height="10%"
fill="purple"/>

<rect x="0" y="0" width="100%" height="100%" fill="blue" />

<use xlink:href="#hole" x="20%" y="40%" width="30%" height="30%"
fill="black"/>

</g>
</svg>