Quiero que el logotipo aparezca animado cuando la barra de navegación se vuelva pegajosa

https://weartuality.com/

Verá la barra de navegación negra en ese sitio. No hay ningún logotipo en esa barra de navegación negra, pero cuando se vuelve pegajosa, aparece el logotipo. ¿Cómo puedo hacer esto usando html css javascript?

Solución del problema

Escuche el evento de desplazamiento y muestre/oculte el logotipo si se alcanza una cierta posición de desplazamiento Y.

const logoElement = document.querySelector(".logo"); // <--- update this selector
const checkLogo = () => {
 if (window.scrollY > 100) {// <-- your non-sticky nav's height here
 logoElement.style.setProperty("transform", "scale(1)");
 } else {
 logoElement.style.setProperty("transform", "scale(0)");
 }
}
checkLogo();
window.addEventListener("scroll", checkLogo);

CSS:

.my-logo {
 transform: scale(0);
 transition: transform.3s;
}