To move/match the coordinates of an image to a fixed coordinate of the parent container using javascript

Bala Santhya K 0
Viewed 22

I want to move my relative image's coordinate dynamically to get moved to a fixed pointer's coordinate which is absolute to it

reactjs typescript javascript
1 Answers

If your elements are in a parent-child relationship, simply use CSS: position:absolute on the child. If they aren't in a relationship: You can use .getBoundingClientRect() on the element that you want to position your second element relative to:

let rect = yourPointerElement.getBoundingClientRect();

rect is an object that holds several information regarding the current position and boundaries, including: { x, y, width, height, top, right, bottom, left } in pixels.

You can now use this information to position your second element relative to it, using CSS (i.E. position:fixed) and changing top/bottom/left/right with JS.

Foxcode0
Related