Saltar al contenido

¿Cómo desplazarse a un elemento específico usando jQuery?

Héctor, parte de nuestro staff, nos hizo el favor de redactar este post ya que controla perfectamente este tema.

Solución:

Mortalmente simple. No se necesitan complementos.

var $container = $('div'),
    $scrollTo = $('#row_8');

$container.scrollTop(
    $scrollTo.offset().top - $container.offset().top + $container.scrollTop()
);

// Or you can animate the scrolling:
$container.animate(
    scrollTop: $scrollTo.offset().top - $container.offset().top + $container.scrollTop()
);​

Aquí hay un ejemplo de trabajo.

Documentación para scrollTop.

Me doy cuenta de que esto no responde al desplazamiento en un contenedor, pero a las personas les resulta útil, así que:

$('html,body').animate(scrollTop: some_element.offset().top);

Seleccionamos tanto html como cuerpo porque el desplazador de documentos podría estar en cualquiera y es difícil determinar cuál. Para los navegadores modernos, puede salirse con la suya $(document.body).

O, para ir a la parte superior de la página:

$('html,body').animate(scrollTop: 0);

O sin animación:

$(window).scrollTop(some_element.offset().top);

O…

window.scrollTo(0, some_element.offset().top); // native equivalent (x, y)

Estoy de acuerdo con Kevin y otros, usar un complemento para esto no tiene sentido.

window.scrollTo(0, $("#element").offset().top);

Comentarios y puntuaciones

Nos puedes corroborar nuestra misión dejando un comentario o puntuándolo te estamos agradecidos.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *