0

I'm creating a plugin that saves user mouse movements. I would like to create a kind of heatmap where the mouse goes. I don't know how to paint the coordinates in a responsive way. The elements are moving depending on device's width. I thought that maybe I could create a function in JS that gets the userwidth, Xcoordenate, and Ycoordenate and returns the coordinates depending on the current screen. But, I would need to get (by javascript) which elements changes position from user width to current width. Is it possible? Any advice?

1 Answers1

1

I would think that this is extremely difficult to do correctly.

You could try to store the mouse coordinates relative to the current element the mouse is moving over, but even that has its limits: When the page width changes the width and height, and even the content, of an element could change.

I think it would be better to only register over which element the mouse cursor is. Then it doesn't matter what shape an element has, or where it is.

See: Determine which element the mouse pointer is on top of in JavaScript

KIKO Software
  • 15,283
  • 3
  • 18
  • 33
  • Thank you Kiko. But how do i recognize which exact element is it? Because not every element has unique id – Álvaro García Aug 06 '21 at 09:52
  • @ÁlvaroGarcía You're almost answering your own question: If you want to do this then each element you're interested in must be identifiable. – KIKO Software Aug 06 '21 at 13:40