Pourquoi utiliser le nasting alors que il suffit juste d’utiliser le balise <li> pour lui donner un style donc je comprends pas tellement l’intérêt du nasting )

Ah je pensais que c'était le contraire a faire, le parent en absolute et l'enfant en relative 😅

Top les effets.

♥️❤️♥️

Magnifique je suis bluffé 💥🤩

Superbe effet, merci ! Petit conseil pour l'explication des positions et des translations : fais une capture d'écran et dessine dessus pour montrer les dimensions 😉

Super tuto 👍😀. Juste une question est ce que ça aurait pas été plus propre de faire le top-layer et le blob avec les pseudo éléments afin de pas surcharger le HTML d'éléments "pas forcément utiles" ? Avec des variables css pour les valeurs de transform du coup

À 14:05, quand tu renommes ta variable, tu fais une multi sélection pour changer la déclaration + l'appel dans le log, mais ça peut être intéressant d'utiliser F2 aussi sur la déclaration. Ça permet de renommer automatiquement toutes les utilisations de cette variable, ultra pratique quand on a beaucoup d'utilisations. ^^

Je veux bien plus d'infos sur les effets négatifs d'utiliser une liste pour englober les liens d'une navigation Enzo. 🤔 Je viens de passer une certif RGAA, et dans ma formation (avec Access42), on nous a rappelé que si + de 2 liens se suivaient, il fallait obligatoirement les englober d'une liste. Ça faisait partie des corrections à faire sur les erreurs d'accessibilité. Mais sinon, toujours un plaisir de suivre tes vidéos. Elles sont claires et intéressantes !

J'aime bien tes katas, celui-ci donne un super effet "wow" très agréable. En plus la construction de tes vidéos, mi-préparées, mi-live, où tu t'adresses au néophyte comme à l'expert, c'est vraiment bien pensé, continue !

Ho c'est trop beau. J'ai la flemme de me demander comment t'as fait, je vais juste te laisser m'expliquer...

Juste ce qu'il me fallait pour ajouter un peu de fun dans mon nouveau projet ! Merci 😊

Wopsy, j'ai utilisé une condition pour coder les évènements de souris avec : if(window.matchMedia("(pointer:fine)").matches) {...} Ça fonctionne, mais il existe les évènements pointermove et pointerout qui permettent de cibler les appareils qui utilisent un dispositif de pointage. Ça m'était sorti de la tête quand j'ai codé cette animation.

super bien expliqué.Merci beaucoup

J'aimerais faire le même type de menu mais horizontal

Liked!

c une liste ?

Je me demandais lorsque tu héberges ton site via Github , dois tu à nouveau importer les fichiers pour pouvoir faire une mise à jour de ton site

merciii

React-router. Mon commentaire est un cadeau pour vous.

merci! c'est très clair!

Bonjour, Merci super pour la vidéo, en revanche je n'arrive pas a intégrer une seconde modale à coté du premier, j'essaye mais il m'ouvre la fenêtre de la première modale. Comment faire stp ?

Clairement la meilleure vidéo de KZbin tu m’as sauvé la vie merci 😁

MERCI MERCI MERCI

juste merci infiniment pour cette pépite.

Salut je me demande si ce processus peut fonctionner avec des images à la place du texte ?

Tu viens de me donner une très bonne information 🎉🎉🎉❤❤❤❤❤❤🎉

Bje es ce qu on peut ajouter des prototype dans les objet natif

Hello, sur mobile cela pose un petit soucis (en tout cas sur iphone), quand on revient en haut il y a un effet de "Bounce". En effet, quand on remonte tout en haut, le rebond nous fait scroll down, j'ai modifié un peu le code en inversant la logique "si currentScroll < scrollFromTop" au lieu de ">" et en ajoutant dans le if un "ou" currentScroll === 0, cela permet de le faire apparaitre mais avec l'effet de translate il disparait et réapparait, je me demande s'il y a une meilleur option...si jamais je suis preneur !

Vous êtes juste incroyable. J'ai tellement appris avec vos vidéos. Je suis aussi dans le groupe discord

Coucou j’ai juste mon fond d’ecran pas d’images pas de texte comment on peut faire merci

Merci 😀

merci monsieur

L'extension Auto Rename Tag est très utile pour faire la même chose. 😉

claire, limpide, bien detaillé, grace a cette video, j'ai un resumé complet sur le deign, et si tu nous faisais des tutos sur figma en detaillant les fonctionnalités a savoir, ce serait sympa, merci beaucoup

Merci, je me suis souvenu de ton explication de l’espace sous l’image (« bug ») et grâce à toi, j’ai pu appliquer ta « correction » en changeant le display de l’image. C’est sur que j’aurais mis du temps à le trouver celui là 👍

navbar, merci beaucoup !

quand je fait la fonction <UserContextProvider> entre le <App /> tout s'enleve de l'ecran est ce nrmal merci

Merci pour la video

C'est également très utile pour créer des jeux en 2D. Merci à vous

merci super bien expliqué

A quoi sert la balise div

Vive Yup !!! 😅

c'est le CANVA du webdesign ce truc ;D

Vidéo très intéressante, comme d'habitude. 🙂 Je pensais que tu allais parler de aria-required cependant qui, lui, est obligatoire pour l'accessibilité. La validation est importante également pour les technologies d'assistance. Un lecteur d'écran précise "saisie obligatoire" lorsque aria-required est à true. ^^

Pour avoir le message d'erreur d'un required en français il suffit de mettre la bonne langue dans la balise HTML (lang="fr"). Ça ne permet pas une personnalisation mais au moins c'est dans la bonne langue 😉

Intéressante vidéo ! 👍 Personnellement, j'ai utilisé les deux approches, sans préférence particulière. En revanche, usage systématique de l'event delegation (car il vaut mieux éviter d'ajouter un listener sur chaque champ d'un form surtout si le form en a beaucoup) et donc : evt target systématique (logique). Et surtout, utilisation de "input.validity" (qui permet de gérer finement les choses : "patternMismatch", "tooLong", "tooShort", "rangeOverflow", ...) pour gérer les spécificités de chaque contrainte posée sur les champs. Et, pour faciliter les choses, un simple objet pour la localisation des messages à afficher en fonction de la langue choisie par l'utilisateur (ou définie par défaut). Je ne pense donc pas qu'il faille éviter "required" (pas plus que les autres attributs de validation, comme "maxlength" ou "pattern"), mais juste qu'il faille bien connaître toutes les propriétés et méthodes mises à disposition par les API pour gérer ce type de problème une fois pour toute (au sein d'une application et même pour toutes les utilisations à venir, car les formulaires, on en a besoin souvent et un peu partout...)

Intéressante vidéo ! 👍 Personnellement, j'ai utilisé les deux approches, sans préférence particulière. En revanche, usage systématique de l'event delegation (car il vaut mieux éviter d'ajouter un listener sur chaque champ d'un form surtout si le form en a beaucoup) et donc : evt . target systématique (logique). Et surtout, utilisation de "input.validity" (qui permet de gérer finement les choses : "patternMismatch", "tooLong", "tooShort", "rangeOverflow", ...) pour gérer les spécificités de chaque contrainte posée sur les champs. Et, pour faciliter les choses, un simple objet {"langue": {"type de validité" : "message", ...}, ...} pour la localisation des messages à afficher en fonction de la langue choisie par l'utilisateur (ou définie par défaut). Je ne pense donc pas qu'il faille éviter "required" (pas plus que les autres attributs de validation, comme "maxlength" ou "pattern"), mais juste qu'il faille bien connaître toutes les propriétés et méthodes mises à disposition par les API pour gérer ce type de problème une fois pour toute (au sein d'une application et même pour toutes les utilisations à venir, car les formulaires, on en a besoin souvent et un peu partout...)

Intéressante vidéo ! 👍 Personnellement, j'ai utilisé les deux approches, sans préférence particulière. En revanche, usage systématique de l'event delegation (car il vaut mieux éviter d'ajouter un listener sur chaque champ d'un form surtout si le form en a beaucoup) et donc : evt.target systématique (logique). Et surtout, utilisation de "input.validity" (qui permet de gérer finement les choses : "patternMismatch", "tooLong", "tooShort", "rangeOverflow", ...) pour gérer les spécificités de chaque contrainte posée sur les champs. Et, pour faciliter les choses, un simple objet {"langue": {"type de validité" : "message", ...}, ...} pour la localisation des messages à afficher en fonction de la langue choisie par l'utilisateur (ou définie par défaut). Je ne pense donc pas qu'il faille éviter "required" (pas plus que les autres attributs de validation, comme "maxlength" ou "pattern"), mais juste qu'il faille bien connaître toutes les propriétés et méthodes mises à disposition par les API pour gérer ce type de problème une fois pour toute (au sein d'une application et même pour toutes les utilisations à venir, car les formulaires, on en a besoin souvent et un peu partout...)

Très bon thème de vidéo