JQuery – Comment animer le défilement vers le haut et le défilement vers une div ?

javascript

JQuery a un prototype de fonction pratique animé qui prend les premières propriétés CSS finales comme premier paramètre, et la vitesse comme deuxième paramètre, par exemple "rapide", "lent" ou l’intervalle de temps spécifié. Le troisième paramètre est un rappel facultatif après l’animation. achevé.

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

Sur mon site Web personnel, j’ai récemment repensé les perspectives de la page pour la rendre entièrement conviviale pour les utilisateurs mobiles. Il y a deux liens à des positions fixes de l’écran, ‘Navigation’ et ‘Top’.

La navigation

Le menu de navigation est placé après le contenu principal de la page, et par conséquent, vous devrez définir une div avec par exemple id=’navigate’. Ajoutez ensuite le code JQuery suivant.

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

Haut

Vous devez d’abord définir une ancre avec par exemple

Placez-le juste après et ajoutez le code JQuery suivant :

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

faire défiler