✅ Noticias, temas, complementos de WEB y WordPress. Aquí compartimos consejos y las mejores soluciones para sitios web.

JQuery: ¿cómo animar el desplazamiento hacia la parte superior y el desplazamiento a un div?

35

javascript

JQuery tiene un prototipo de función útil animado que toma las primeras propiedades finales de CSS como primer parámetro y la velocidad como segundo parámetro, por ejemplo, "rápido", "lento" o el intervalo de tiempo especificado. El tercer parámetro es una devolución de llamada opcional después de que la animación es acabado.

var properties = { color: red; };
$('div').animate(properties, "fast", function() {});

En mi sitio web personal, recientemente rediseñé la perspectiva de la página para que sea completamente fácil de usar para dispositivos móviles. Hay dos enlaces en posiciones fijas de la pantalla, ‘Navegación’ y ‘Superior’.

Navegación

El menú de navegación se encuentra después del contenido principal de la página y, por lo tanto, deberá definir un div con, por ejemplo, id=’navegar’. Luego agregue el siguiente código JQuery .

$("a[href='#navigate']").click(function(){
    $("html, body").stop().animate(
        {scrollTop:$("div#navigate").offset().top}, "slow");
        return false;
    })
});

Parte superior

Primero necesitaría definir un ancla con, por ejemplo

<a name='top'></a>

Coloque esto justo después y agregue el siguiente código JQuery :

$("a[href='#top']").click(function(){
    $("html, body").stop().animate(
        {scrollTop:0}, "slow");
        return false;
    })
});

Desplazarse

Fuente de grabación: helloacm.com

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More