Indicateur de menu animé en JavaScript

Article ► grafikart.fr/tutoriels/indica...
Abonnez-vous ► bit.ly/GrafikartSubscribe
00:00 Première approche
14:53 Approche FLIP
Nous allons voir aujourd'hui comment créer un effet d'indicateur animé en utilisant du CSS & du JavaScript. L'objectif est de créer une petite barre qui se place sur l'onglet sélectionné avec un effet de déplacement.
Soutenez Grafikart:
Devenez premium ► grafikart.fr/premium
Donnez via Utip ► utip.io/grafikart
Retrouvez Grafikart sur:
Le site ► grafikart.fr
Twitter ► / grafikart_fr
Discord ► grafikart.fr/tchat

[@pintokatendejonathan1740]

Merci expert, pour cette vidéo

[@oseebotendju9120]

Trop top ce tutoriel, merci encore pour ce savoir que tu nous partages.

[@ephraimjean-samuelbaha7162]

Merci grafikart pour cette vidéo c'est exactement ce que je cherchais

[@uchiwauzumaki602]

notre sauveur merci beaucoup

[@arikomagik13]

Au top ! Merci !👌🏼👏🏽👍🏼

[@TheBendu73]

Je pense que j'ai pas trop compris le concept mais c'est toujours cool d'apprendre de nouveau truc. Moi j'aurais fais un hover 😅

[@gobajoseph5064]

Super intéressant merci

[@amadoufofana8317]

c vraiment intéressant ce que vous faites merci bcp

[@vivianmingaud7942]

Salut Grafikart, j'ai une petite idée de tuto à te soumettre : Le webdesign et le webmastering. On trouve beaucoup de tuto sur des techno et des super cours sur plein de choses mais peu sur ces métiers demandant beaucoup de connaissances et de techniques (du graphisme à l'hébergement) sans être pour autant un spécialiste fullstack 🙂 Je dis ça car j'ai fait une formation de 9 mois (bien trop courte😁)en webdesign et il était très difficile pour nous les étudiants de faire la diff entre le WD, le dev, l'intégration... Donc ça pourrait être une bonne idée de synthèse sur plusieurs vidéos, permettant en même temps de réactualiser certaines des tiennes dont les techno auraient pu évoluer en 8 ans. En tout cas merci beaucoup pour tes cours qui sont toujours au top ! Bien à toi 🙏

[@tcgvsocg1458]

top merci

[@mralphak2873]

Hello graphikart, pourrait tu faire une vidéo sur ton top environnement de développement (sgbd, ide..) et une tier list des langages...sinon je kiff tes vidéos x)

[@dazynicolas6799]

C'est vraiment cool, mais j'ai une question, comment récupérer l'URL sur Js (Ex: href=" {{ path = ' exemple' }}") correspond sur l'ongle si on utilise un framework par exemple ?

[@user-ft1xi5gz6n]

Bonjour 🙂 merci d'abord pour vos efforts pour nous aider à se développer svp pourriez vous me dire quoi étudier exactement et apprendre pour devenir programmeur développeur informatique d'applications sur ordinateur ou sur internet ? Merci beaucoup d'avance 🙏

[@androrifain]

je pense qu'il ne sert à rien de créer des animations au survol pour des écrans tactiles puisqu'il n'y que des évènements "touch", excepté ceux qui utilisent des souris pour leur mobile ou tablette, ceux qui est assez rare

[@grafikart]

Oui perso je change la couleur au hover, mais je ne bouge l'indicateur qu'au clic / touch

[@A7ka7]

Salut, merci pour la technique, je me demande quel est l'intérêt de faire comme ça plutôt qu'animer un border bottom en CSS seulement ?

[@Feez313]

Salut, tout simplement pour avoir ce type d'animation. Tu ne peu pas déplacer le trait entre chaque élément de la navigation avec uniquement des propriétés css, utiliser le js te permet de récupérer la position et la taille de l'élément sélectionné et de le déplacer en fonction. Ce n'est pas très utile niveau UX mais ça peu rajouter un effet cool sur ton site. Et puis je pense que Grafikart l'a présenté de cette manière pour que ce sois plus simple et plus rapide a comprendre, maintenant que tu à la technique, à toi d'être créatif et de l'utiliser dans différentes situations !