Bonjour

Je ne comprends rien en JS

et j'ai un code qui fait monter le scroll bar en haut de la page

mais je ne sais pas comment inverser ce code : je veux quand je clic sur le bouton ça me descend ou me fait monter ça depant de la place où je suis

comme ce site: http://visitpetra.jo 

voilà le code:

<span class="btn">
<button id="btn">Mon<span style="font-size: 2em;">↑</span>er</button>
</span>
<script type="text/javascript">
$(document).on('click', '#btn', function() {$('html,body').animate({scrollTop: $('#top').offset().top}, 1000);});
</script>

merci

Hello,

Dans le code que tu fournis, et notamment cette partie :

.animate({scrollTop: $('#top')

Le #top est une ancre ! Cela signifie que ta page va se déplacer de sorte à ce que cet élément soit positionné en haut de celle-ci.

La fonction complète permet d'effectuer, en cliquant sur un bouton, une animation (qui, ici, durera 1000 ms ou 1 seconde) de scroll vers l'ancre sélectionnée.

-
Edité par 7umpy 19 septembre 2017 à 20:03:42

Hi

ça veut dire que si le bouton se situe en haut de la page et l'ancre en bas, avec ce code le scroll descend?

merci d'avance

Avec des ancres, tu fais en sorte de naviguer "dans la page" et non "vers une autre page".

Tu peux en définir tout au long de ton code HTML en mettant des balise avec un id="tonAncre" et t'y rendre automatiquement en créant un lien <a href="#tonAncre">Ton ancre</a>. Ceci ne produira pas d'animation, mais fonctionne sans JS.

Mettre du JS ne permet que de "styliser" la navigation, mais n'apporte rien en terme de fonctionnalité pure et dure. Le lien proposé par 7umpy te donnera toute les infos nécessaires