Bundle : Intégrer un menu avec jQuery en 3 exercices pratiques
-29% de réduction
Dans ce tuto CSS & jQuery nous allons voir ensemble comment créer un menu responsive (menu burger), afin de le rendre compatible avec la version mobile de votre site. Pour cela, nous utiliserons la technique du mobile first qui consiste à créer en premier, le menu pour le mobile et de l'adapter petit à petit pour les écrans plus grands.
A la fin de ce tuto nous verrons une petite astuce pour que la transition du menu mobile/bureau, lors du redimensionnement du navigateur, soit parfaite.
Aucun framework (comme Bootstrap par exemple) ne sera utilisé dans ce tuto, nous ferons tout à la main, pas à pas, pour que vous puissiez rapidement le mettre en place vos prochains sites mobile.
Les fichiers de départ & ceux du tuto terminé sont fournis pour que vous puissiez suivre la vidéo plus facilement.
Je vous invite à regarder l'extrait vidéo pour rendre compte du résultat final.
Bon visionnage !
Table des matières de cette formation CSS, jQuery (durée : 49m55s)
-
- Introduction gratuit 00:02:40
- Rendre le container du site responsive 00:05:20
- Créer & styliser le menu responsive 00:12:00
- Bouton pour ouvrir le menu, icônes vectorielles & adaptation du menu pour les écrans larges 00:17:23
- Partie javascript pour créer des actions sur le bouton ainsi que des animations 00:12:32
- Fichiers sourcestélécharger
- Certificat
Formateur : Adrien Gazaix
-
Clair, complet et utile
-
Très bonne pédagogie et clarté de compréhension. Le résultat est très satisfaisant. Dernière vidéo ardue pour un débutant...
-
C'est clair et parfaitement expliqué mais je suis frustré du fait que vous n'ayez pas ajouté un logo. Parce je galère pour l'ajouter.
-
Avec quelles versions de logiciels ce tuto est-il compatible ?CSS 2, CSS 3, jQuery 11.1.2, jQuery 1.11.1, jQuery 1.11.0, jQuery
-
Quel est le niveau requis pour suivre ce tuto ?intermédiaire
note moyenne
avis laissés