Tenemos un tema personalizado y la cabecera se encoge al desplazarnos. Creemos que la función de avatares fijos integrada recientemente está causando un comportamiento de “thrashing” justo cuando la cabecera se encoge. Vea el video adjunto:
.topic-post.sticky-avatar {
.topic-avatar {
position: relative !important;
top: unset !important; /* Puede ser necesario en algunos casos */
}
}
Eso oculta el avatar fijo, pero no parece ayudar con el “thrashing”. ¿Hay algo más que deba hacer para que esto funcione o para deshabilitar la función por completo?
No estoy 100% seguro de que sea el cambio de los avatares fijos, así que por favor comente si cree que podría ser otra cosa.
Creo que el problema no está relacionado con los avatares pegajosos.
Cuando la cabecera se encoge, la página se acorta y la posición de desplazamiento de la página cambia. Así que lo que sucede es que obtienes este parpadeo mientras la página entra y sale de la posición donde la cabecera debería encogerse.
Si muestro la posición de desplazamiento de la página en la consola de mi navegador, puedes verlo en acción… la cabecera se encoge unos 60px, y eso se refleja en la posición de desplazamiento mientras parpadea:
Para solucionar esto en JS, creo que probablemente podrías añadir la diferencia de altura a la posición de desplazamiento al mismo tiempo que ocurre la transición de la cabecera.
Otra forma de solucionar esto usando solo CSS sería:
.d-header-wrap {
// esto hace que la posición de la cabecera sea fija, por lo que no forma parte de la altura de la página
position: fixed;
width: 100%;
}
#main-outlet {
// esto compensa el contenido de la página por la altura de la cabecera grande
// necesario porque la posición fija pone la cabecera encima del contenido
padding-top: 150px !important;
}
