Un usuario pregunt贸 馃憞
Hola, estoy tratando de usar un c贸digo w3school simple que me permite ocultar mi barra de navegaci贸n mientras me desplazo hacia abajo en el sitio.
<script>
/* When the user scrolls down, hide the navbar. When the user scrolls up, show the navbar */
var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementById("masthead").style.top = "0";
} else {
document.getElementById("masthead").style.top = "-150px";
}
prevScrollpos = currentScrollPos;
}
</script>
El problema es que cuando se carga el control deslizante inteligente 3, la barra de navegaci贸n se restablece y funciona como yo lo hac铆a al desplazarme, por lo que establece el CSS en 芦top = -150px禄 …
Cuando intento probar el sitio sin un control deslizante inteligente, el estilo de la barra de navegaci贸n oculta funciona perfectamente.
驴Hay alg煤n tipo de conflicto aqu铆?
(@nextendweb_gabor)
Hace 1 a帽o, 3 meses
隆Hola @nicofanjul!
El problema que ves surge porque algunos c谩lculos requieren que activemos el evento de desplazamiento de p谩gina, que activa tu c贸digo, justo cuando est谩s en la parte superior de tu p谩gina, esta parte del c贸digo:
prevScrollpos > currentScrollPos
tiene los siguientes valores:
0 > 0
fallando y en lugar de top: 0, se usa -150px. A煤n debe modificar su c贸digo al valor superior 0, cuando se encuentre en la parte superior de la p谩gina:
if (prevScrollpos > currentScrollPos || currentScrollPos == 0) {
隆y deber铆a estar bien!
Todos juntos:
<script>
/* When the user scrolls down, hide the navbar. When the user scrolls up, show the navbar */
var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos || currentScrollPos == 0) {
document.getElementById("masthead").style.top = "0";
} else {
document.getElementById("masthead").style.top = "-150px";
}
prevScrollpos = currentScrollPos;
}
</script>Lanzador de hilos
(@nicofanjul)
Hace 1 a帽o, 3 meses
Gracias, esto ha resuelto el problema hasta ahora.
(@jcfromkc)
Hace 11 meses, 3 semanas
隆隆Gracias!! Esto tambi茅n funcion贸 para m铆.
驴Solucion贸 tu problema??
0 / 0