Plain JavaScript - ScrollIntoView inside Div

Question

I have the requirement to scroll a certain element inside a div (not a direct child) into view.

---

Basically I need the same functionality as Sc

Answer 1

This functionality can be achieved in some few steps. First you get the position of the child using childElement.getBoundingClientRect(); which will return the following values

bottom : val
height: val
left: val
right: val
top: val
width: val

Then just position the child element according to the top left values into the parent element keeping child elements position as absolute. The parent Element's position must be relative type to place the child properly and get the effect of ScrollIntoView.

childElement.style.position = 'absolute';
childElement.style.top = 'value in px';
childElement.style.left = 'value in px';