Rotate Element On Scroll Within A Div Container

Ok so here's a challenge: I'm looking to rotate a fixed element when you scroll up and down inside a < div > - and not when you scroll on the entire page. So how do i target

Solution 1:

If I understand it right, you could select the element you'r adding an event to.

Something like :

const scrollDiv = document.querySelector(".scrollOnMe");
scrollDiv.addEventListener("wheel", () => {
  console.log("Scrolling !");
})

div {
  height: 30px;
}
.scrollOnMe {
  background-color: green;
}
.foo {
  background-color: red;
}

<div class="scrollOnMe">Scroll on me !</div>
<div class="foo">Don't :(<div>