Scroll down when hovering over a block?

Question

JavaScript

Please help! There is a block with a fixed height of 915px. It contains child blocks, each 305px high. Only 6 such blocks fit into the parent container, the rest are visible when scrolling down.
How to make it so that when hovering over the last two elements (or something like below), the parent container scrolls down, for example, to the height of this child block itself, or by 100 px. And this was not once, but repeated, for example, if they pointed at the last blocks.

Answer 1

the div you hover over
parent is the parent
mouseover is the event when you hover over the child

let parent = document.querySelector(".класс родителя");
let div = document.querySelector(".класс ребенка");
div.addEventListener("mouseover",function(){
  parent.scrollTop = div.scrollHeight;
  
});

The essence of the code is that you scroll the parent to the level of the child