animate - smooth scroll href jquery

enlace con href="#" desplaza la página hacia arriba cuando se usa con jquery slidetoggle

Question

Posible duplicado:
¿Cómo impido que una página web se desplace hacia la parte superior cuando se hace clic en un enlace que activa javascript?

Estoy usando slidetoggle de jquery para mostrar / ocultar divs. el elemento que controla el deslizamiento es un enlace de texto (un texto dentro de </ a>) que tiene href = "#" por lo que se verá como un enlace (subrayado, cambio de cursor).

el problema es que cuando se hace clic en el enlace, además del efecto deslizante, la página se desplaza hacia arriba.

intenté reemplazar href = "#" con href = "" pero eso deshabilita el efecto mostrar / ocultar div. Supongo que podría agregar a la etiqueta Name = "somename" y luego establecer href a href = "# somename", pero preferiría no utilizar trucos como ese.

¿Por qué href = "#" desplaza la página hacia arriba?

cualquier idea sería muy apreciada

Answer 1

Debes agregar return false; a su controlador de clics.
Esto evitará que el navegador ejecute la acción predeterminada para el clic.

Answer 2

Otros te han dado soluciones. Pero para responder específicamente a su pregunta, # refiere a la página actual. Y dado que la interpretación de las etiquetas consiste en mostrar la parte superior de la etiqueta, al hacer clic en la etiqueta # desplaza hacia la parte superior de la página actual.

Answer 3

return false o event.preventDefault() es lo que necesita en su controlador de eventos click para evitar que se produzca la acción predeterminada. Un elemento <a> con un href de # hará que la ventana del navegador salte a la parte superior de la página como acción predeterminada

Answer 4

Varias opciones:

1. Poner el return false; en la parte inferior de su controlador de clics y no se seguirá el href.
2. Cambiar el href a javascript:void(0);

3. Llame preventDefault al evento en su controlador:

   function( e ) {
     e.preventDefault();
     // your event handling code
   }