A plugin for Keyframes that plays animations based on mouse distance from an element.
importProximityfrom'@keyframes/proximity';Keyframes.plugin(Proximity);constblockElem=document.getElementById('block');constblock=newKeyframes(blockElem);block.proximity((obj)=>{blockElem.style.boxShadow=`red 0 0 ${0.5*obj.distancePercentage}px`;});{mouse,// Current mouse x and y.mouseDistance,// Distance from the element in pixels.viewPortDistance,// Distance from the edge of the viewport in pixels.distancePercentage,// Distance of the mouse from the target element as a percentage where zero is the viewport edge.targetEdge,// Closest point on the edge of the target object to the mouse.viewPortEdge,// Closest point on the edge of the viewport to the target edge.collision: !mouseDistance,// Boolean if the mouse is over the top of the element.}