Faites défiler votre page où vous voulez, et améliorer l'expérience de vos visiteurs en leur offrant une navigation fluide et agréable. Utiliser l'option du bouton "Retour en haut" pour revenir au haut de la page sans effort.

Fonctionnalités

• Scroller / Défiler vers n'importe quel élément de la page (grâce à son ID HTML)
• Fonctionne avec n'importe que lien, de menu ou lien texte
• Facile à utiliser grâce à une classe CSS
• Option pour activer le bouton "Retour en haut"

Comment l'utiliser

Avec un lien de menu

Editez un lien de menu dans votre gestionnaire de menu. Allez dans les options "Type de lien" pour ajouter la classe css "scrollTo" au lien. Cela va indiquer au plugin que ce lien doit être scrollé.

Vous devez définir vers quel élement de la page il faut scroller. Par exemple si vous avez un bloc dans la page ayant pour identifiant HTML "maincontent", vous puovez écrire "#maincontent" dans l'option du lien pour faire défiler la page juqu'à cet élement. Vous devez utiliser un lien de type "Lien externe".

Vous pouvez facilement trouver l'identifiant HTML d'un bloc si vous utilisez Template Creator CK pour créer votre template. L'ID est écrit dans la zone en noir lors du survol du bloc. Ci-après un exemple avec le bloc "maincontent" (extrait de l'interfce de Template Creator CK ) :

Si vous n'utilisez pas Template Creator CK, vous pouvez inspecter votre page avec Firebug pour trouver l'ID du bloc.

Avec un lien texte

Vous pouvez utiliser la même technique mais sur n'importe quel lien de la page. Il suffit d'assigner la classe CSS "scrollTo" au lien et de pointer la cible vers l'élément de la page.

Exemple de code html pour un lien standard :

<a class="scrollTo" href="#maincontent">Click me to scroll</a>

Télécharger le plugin Scroll To CK

Notes de version :

VERSION 1.0.4  - 21/05/15 :
- corrige souci de décalage si tous les éléments du DOM ne sont pas chargés
- améliore la gestion de la classe active sur les éléments de menu
- améliore la gestion du scroll avec liens de page qui pointent vers un scroll

VERSION 1.0.3  - 21/05/15 :
- ferme automatiquement le menu hamburger (compatibilité avec les templates Template Creator CK)

VERSION 1.0.2  - 27/03/15 :
- corrige souci javascript

VERSION 1.0.1  - 16/03/15 :
- Ajoute classe "active" sur le lien lors du scroll vers l'élément de la page

Version 1.0.0 - 10/02/15 :
- Première version