Créer des panneaux stylés (Flexbox/JS).
HTML-код
- Опубликовано: 14 дек 2020
- Abonne-toi à la NewsLetter pour recevoir des tas d'infos sur le développement web :
mailchi.mp/94d9da505508/le-de...
Le code source : github.com/Ziratsu/flex-panneaux
Le lien du Discord : / discord
Tu veux apprendre les technologies du web ? C'est par ici :
www.ecole-du-web.net/
Je suis aussi sur la plateforme Tuto.com :
fr.tuto.com/formateur/enzo_us...
Et sur Udemy :
www.udemy.com/user/ustariz-enzo/
Abonne-toi à ma chaîne :
/ @ecoleduweb
Suis-moi sur Twitter :
/ ledesignerduweb
Si tu veux que je fasse des vidéos sur certains sujets dis le moi!
-----------------------------------------------------------------------------------------
Très bonne vidéo... Nous les débutants avons besoin des vidéos de gens pour progresser en JS merci énormément pour la vidéo 🙏🙏
Merci Enzo pour toute c'est nouveautés dans le CSS et dans le Javascript surtout que je suis ton cour JS en ce moment et qu'and plus je suis dans les " évènements " donc ca tombe à pic !
et du coup le " Event.stopPropagation() " prend tout sont sens .. super vidéo !!! j'en profite pour faire une pub pour Enzo ( j'ai acheté tout c'est cours sur udemy car ils sont excellents ) 👌
je confirme les cours sur udemy sont excellents ... par contre, et désolé si je me trompe mais j'ai l'impresion que t'as rien dit sur les differents selecteurs css .. je me trompe ? :(
Super intéressant, bien expliqué comme toujours, l'effet est vraiment top Merci Enzo.
Topissime j'adore ton travail encore merci Enzo
Coucou Enzo, j'adore :) Merci !
🔥🔥
Super vidéo ! Merci beaucoup !
Très beau travail merci
Un tueur, comme d'hab! Merci à toi
🗡️🗡️
Vraiment sympa je vais l utiliser dans mes projets. Sinon vidéo au top comme d hab.
Merci Michael ! 🙌
Je t'ai découvert hier et j'ai déjà appris et surtout compris tellement de choses ! Merci beaucoup ! Continue comme ça c'est génial !
Super la vidéo. Pour le problème avec le bouton, on pourrait vérifier que le e.target n'est pas une instance de HTMLButtonElement. Si c'est le cas on ne fait rien et on laisse le bouton agir, si non on active le boxe et on désactive le reste.
Salut, très bonne vidéo. J'ai repris ton code et j'ai remplacé dans ton CSS le : .active {...} par .bloc.active {...} et j'ai enlevé la 2eme partie du Js. Ça a l'air de marcher pareil mais je sais pas si c'est mieux niveau performance / ergonomie.
si en utilise bien les variables en css en peut arriver a ce résultat
Omg
bonjour on ne commende pas la nourriture, mais chacun à son style, surtout pour faire une touche spécial
Tu devrais essayer oxygen builder c'est un constructeur de pages WordPress avec énormément de possibilités de dev
Je vais check ça :)
C'est le builder des devs html css et pas cher en plus je peux t'envoyer le plugin si tu veux essayer
avec :active
Enzo c'est quoi ton cursus en informatique ?
Autodidacte!
@@EcoleduWeb Félicitations ! Moi aussi je suis autodidacte et j'espère arrive à ton niveau avec le temps ;) bonne continuation à toi
J'adore tes commentaire ah ah ah
"ah, ça a peut-être arrêté de fonctionner parce que je suis allé me doucher " ;-)
bon, sinon, je suis contente, quand tu as écrit document.querySelector('allBlocs'), je me suis fait la réflexion que ça n'allait pas aller... ça me rassure d'arriver à trouver des erreurs des fois parce que je peux perdre encore beeeeeeeeeeeeeeeauuuuuuuucoup de temps sur des conneries pareilles dans mon code...
Oui quand je code et que je parle en même temps ça m'embrouille, mais c'est bien de montrer de la résolution de problème aussi c'est vrai !
Merci.. Du coup il a y a tjrs un bloc active donc tjrs un bloc ouvert. Je suis sur un site et j ai cet inconvénient ou mon client veut que le bloc puisse se refermer. Client roi lol.
Le mieux pour l'UX c'est de laisser un panneau ouvert de base, ça permet de montrer qu'il y a une interaction ici et qu'on peut ouvrir tout ça.
Sinon, enleve la classe 'active' que j'ai mise de base en HTML et le tour est joué ;).
Pour le JS on détecte quand on clique deux fois de suite sur le même panneau( si il a déjà la classe active), et on le ferme.
Ainsi on peut fermer tous les panneaux.
J'entends déjà les prochaines modifications de ton client dans l'oreillette, bon courage !🙌