Un mini-menu pour scroller dans vos pages avec jQuery
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
58m22
de formation
7
leçons vidéo
1
chapitre
Intermédiaire
niveau requis
Graphoeil
Graphoeil
Formateur

Un mini-menu pour scroller dans vos pages avec jQuery

4.8/5 Trustpilot (1399 avis) Satisfait ou remboursé
58m22
de formation
7
leçons vidéo
1
chapitre

Envie de savoir comment créer un mini menu, tout le temps affiché à l'écran et qui vous permet de scroller dans une page (pour un site de type OnePage par exemple)? Alors suivez ce tuto en vidéo.

Au programme de ce tuto menu pour scroller dans une page avec jQuery

Voici les notions abordées dans ce cours jQuery :

  • Nous verrons comment créer un mini menu
  • Nous verrons comment le positionner en permanence sur la page
  • Nous verrons comment faire en sorte de faire scroller la page, lorsqu'on cliquera sur ce menu
  • Nous verrons comment faire en sorte de faire réagir les différentes partie du menu en utilisant le scroll par défaut du navigateur
  • Nous découvrirons la bibliothèque Modernizr qui permettra, en autre, de détecter si l'utilisateur peut utiliser ou non le menu sur une interface tactile (sur smartphone et tablette par exemple)

La technique décrite dans ce tuto peut également très bien convenir pour animer un menu dans le cadre d'un site one-page.
Les fichiers sources de ce tuto sont fournis. Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions ou remarques.

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Introduction
Leçon 2
Préparer la page HTML
Leçon 3
Les styles CSS de la page
Leçon 4
Modernizr et les styles CSS
Leçon 5
Créer le mini-menu jQuery et écouter les clicks
Leçon 6
Écouter le scroll et interagir avec le mini-menu
Leçon 7
Les événements resize et orientationchange

Table des matières

Leçon 1

Introduction

01m07
Leçon 2

Préparer la page HTML

08m23
Leçon 3

Les styles CSS de la page

08m05
Leçon 4

Modernizr et les styles CSS

06m39
Leçon 5

Créer le mini-menu jQuery et écouter les clicks

12m09
Leçon 6

Écouter le scroll et interagir avec le mini-menu

18m03
Leçon 7

Les événements resize et orientationchange

03m56

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Deux façons de suivre cette formation

À l'unité
Pour vous former sur ce sujet précis
7,99€
Paiement unique, sans abonnement
Accès à vie à cette formation
58m22 de vidéo • 1 chapitre
Satisfait ou remboursé voir conditions
Accès immédiat après paiement
Avec l'abonnement
Pour progresser en continu
34,90€ /mois
Sans engagement
Cette formation + 6 793 autres en illimité
Plus de 20 nouvelles formations par mois
Résiliable en 1 clic, à tout moment
Commencer avec l’abonnement
Accès immédiat, pendant votre abonnement

Inclus dans les deux formules

  • Hors connexion via l'app Tuto.com
  • Salon d'entraide pour vos questions
  • Certificat de complétion
Paiement sécurisé 1,4 million d'apprenants 4.8/5 Trustpilot
Logo carte-bancaire-monoLogo visa-monoLogo mastercardLogo paypal-monoLogo klarna-monoLogo apple-pay-monoLogo google-pay-mono
Une question avant de choisir ? Écrivez-nous ou appelez le 01 84 80 80 29 (du lundi au vendredi, 10h-12h et 14h-16h)

Formations complémentaires

Les apprenants qui suivent cette formation s'intéressent aussi à :

Abonnement 34,90€/mois

Attendez ! 🤗

Accédez à plus de 1427 tutos gratuits

Notre politique de protection des données