Mirror
/
web-color-wheel
mirror of https://github.com/arantius/web-color-wheel.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Clip in CSS. 

Not SVG, so clicks outside the circle (but in the SVG box) cancel a locked color.  Hover in that area also behaves as expected.
This commit is contained in:
Anthony Lieuallen 2022-11-20 20:18:38 -05:00
parent 5df5b46587
commit 3284ef29d8
1 changed files with 5 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
colors.html
View File

@ -37,6 +37,10 @@ body {
margin: 1ex;
text-decoration: none;
}
svg {
clip-path: circle(300px at center);
}
</style>
</head>
<body>
@ -46,19 +50,12 @@ body {
height="600"
version="1.1"
viewbox="0 0 1024 1024"
width="800"
width="600"
xmlns="http://www.w3.org/2000/svg"
>
<style>
polygon { stroke-width: 5px; }
</style>
<defs>
<mask id="circle-mask" maskUnits="userSpaceOnUse">
<rect x="0" y="0" width="1024" height="1024" fill="black" />
<circle cx="512" cy="512" r="512" fill="white" />
</mask>
</defs>
</svg>
<!-- https://github.com/gorhill/Javascript-Voronoi -->