<div id='colorsquare'></div> | |
<script> | |
var el = window.colorsquare | |
el.style.cssText = ` | |
width: 200px; | |
height: 200px; | |
border: 2px solid black; | |
` | |
window.addEventListener('mousemove', function (evt) { | |
var x = evt.clientX / window.innerWidth | |
var y = evt.clientY / window.innerHeight | |
var hue = Math.round(x * 360) | |
var sat = Math.round(y * 100) | |
var color = `hsl(${hue}, ${sat}%, 80%)` | |
el.style.background = color | |
}) | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment