Как мне отловить событие, когда срабатывает sticky-top?

Question

[Никита Гуриев]

Что нужно:
Нужно сделать так, чтобы после срабатывания sticky-top этот самый блок разворачивался полностью по высоте на 100%.


Хм, кажется сам разобрался... См. CodePen или:

HMTL

<p>lorem128</p>

<div class="sticky-top bg-primary text-white float-left rounded-right border p-2" id="sticky">Menu
</div>
<div id="stPos" class="p-2 sticky-top bg-light rounded border float-right">
  Menu coord:
</div>

<p>lorem2048</p>

JavaScript

let stPosID = document.getElementById("stPos");
let stickyID = document.getElementById("sticky");

window.addEventListener(
  "scroll",
  (e) => {
    let gbcr = stickyID.getBoundingClientRect();
    stPosID.innerText = "Menu coord: " + gbcr.y;
    if (gbcr.y <= 0) {
      stickyID.innerText = "Top 0 event!";
      stickyID.style.height = "100vh";
    } else if (gbcr.y > 0) {
      stickyID.innerText = "Menu";
      stickyID.style.height = "";
    }
  }
);