Evitar el comportamiento predeterminado de hash en la página carga

Question

Tengo una página con una interfaz con pestañas. Cada pestaña tiene una identificación única. He habilitado enlaces que apuntan a esa página con el id. Adjunto después del hash, y ahora estoy tratando de eludir el comportamiento predeterminado del navegador que abre una URL con hash en la ubicación del elemento en la página.

Así:

• enlaces páginaA a la página B como esto: abre <a href="pageB.php#Tab4">Go</a>
• páginaB, y mi jQuery activa la ficha correcta, pero el navegador se haya desplazado hacia abajo, donde <div id="Tab4"> se encuentra en la página.

Eso es exactamente lo que quiero evitar.

¿Alguna idea? Gracias!

Answer 1

No hay una manera de evitar el comportamiento hash predeterminado, pero puede modificar su esquema de hash para que la etiqueta # no se corresponda con ninguna ID en su página. En la carga de la página, tome el valor hash y agregue una constante (por ejemplo, _hash), luego desplácese a esa usando jQuery.

Ejemplo: http://mysite/page.php#tab4

page.php tiene <div id="tab4_hash"></div>

al cargar la página, obtener el div haciendo tab4 + _hash

Answer 2

Después de terminar de cargar la pestaña derecha, ejecute lo siguiente:

window.location = '#'; 

Answer 3

Yo usaría esto:

window.scrollTo(0,0); 

De esta forma no es necesario cambiar los identificadores de elementos o cualquier otra cosa.

Me encontré con el problema donde quería desplazarme hacia abajo a la pestaña, pero por alguna razón se desplazó más allá de ella hasta la parte inferior de la página (no, no había una identificación duplicada). Creo que es porque el navegador se desplazaría a la identificación antes de que el contenido terminara de cargarse, y el contenido extra empujó al elemento sobre la nueva posición de desplazamiento). Lo arreglé con esto:

if(document.location.hash) 
{ 
    window.location = document.location.hash; 
} 

el "if" aquí es obligatoria o lo que podría tener un bucle infinito

Answer 4

1. Sólo debe ocultar el elemento con id = picadillo de forma predeterminada
2. Аnd luego, después de cargar la página, haces que el elemento sea visible.

Puede encontrar más información aquí: How to disable anchor "jump" when loading a page?