I’d like to animate an element when the mouse position intersects only in one dimension.
Example: I have text in the middle of the page. I’d like to vary the properties of that text when the mouse intersects with it vertically — that is, whenever an imaginary vertical line going through the mouse position would intersect with the text, even if the mouse is not actually over the text element.
The problem I’m having is that it’s very clear how to animate the text based on either (1) the mouse’s X or Y position on the screen or (2) the mouse’s position when hovering over the element. But neither of these accomplishes what I want.
Anyone know how to do this?