CSS / JavaScript : Créer une fenêtre modale en 2019

Dans ce tutoriel vidéo vous apprendrez à créer une fenêtre modale en JavaScript.

Soutenez Grafikart:

Retrouvez Grafikart sur:

[ZELD]

Ce genre de vidéo "Bonne pratique en 2019" sont très intéressantes !

[achenguikemo]

Merci pour tes tutos (même si je n'ai pas entièrement regardé celui-ci 😅)
Je me rend compte que je ne t'ai jamais remercié pour toutes tes formations pourtant j'ai tellement appris de toi !
Grand merci et grosse force à toi !

[monsieurkone.]

Merci infiniment Jonathan
Tu es le meilleur et j'attends toujours tes tutos.

[bonsoirlove]

Ton élocution est excellente, vidéo aussi agréable qu'instructive

[yaen]

Merci Grafikart au moins sa sert d'être indépendant des fonctions déjà crées qui existent déjà. T'es le meilleure😊😊😊

[aurelienvasseur]

Une vidéo d'une très très grande qualité ! Un grand merci et bravo à toi !

[redamadjoub]

Merci beaucoup pour ce tuto!
Comme d'habitude très instructif.

[MakdoKro]

Bonjour,
Je ne comprend pas pourquoi on a besoin de passer l'évènement en paramètre à 19:02 ?
Pourquoi closeModal() ne suffirai pas ?

[mustaphaazergui]

Encore une fois une superbe vidéo tuto! Grand Merci

[Jordan-iend]

Merci pour le tuto ! je réécris un commentaire après m'être trompé la première fois, il faut ajouter tabindex="-1" à tous les éléments "focusables", pour pouvoir utiliser correctement le focus() en js sans surcharger d'une classe. Sinon le navigateur considère que le focus est géré normalement, et court-circuite un peu le js.

[rayunn]

Merci beaucoup pour ce super tuto,
très bien expliqué comme d'habitude ! 😃
ça m'as été super utile !

[mathieucalteau]

@grafikart Bonjour et merci beaucoup pour cette vidéo très pédagogique et instructive. Il y a quelque chose que je ne comprend pas bien dans le cours et peut être pourrais vous m'éclairer. A ma connaissance, l'acronyme AJAX signifie 'Asynchonous Javascript And Xml" ( Javascript asynchrone et XML) pour faire référence à un usage du Javascript asynchrone utilisant des requête HTTP et le XML afin de charger une page web sans avoir à la recharger. Or, dans la vidéo à 42:05 vous dites que la fonction "loadModal' est AJax, or selon les cours précédents, je comprend qu'elle est "Top level Await" car associé à une fonction "async" et comportant un "await". C'est donc du Javascript asynchrone "classique" (je n'ai pas vue de XML ou de "httpRequest"). Ma question est donc: en quoi est-ce de l'Ajax ? Je vous remercie et vous souhaite un bon week end. Prenez soin de vous.

[ewenlbh]

tu as oublié le <select> dans les éléments focusables

[carolinerougeolle]

Super d'avoir inclus l'accessibilité !

[yveskone]

Merci grafikart tu est le meilleur trop cool t'es tutos

[fabriceatlan]

Bonjour. Je rencontre un problème avec un iframe. Cette balise n'est pas focusable. Comment la rendre accessible par la tabulation ?

[gurvan]

En voulant mettre une image dans le lien, la zone cliquable n'est que autour de mon image et non dessus comment faire s'il vous plait ?

[claudelalyre]

La prochaine étape, aller dans une salle de concert et montrer ton écran sur grand écran et faire ton tutoriel devant une foule en délire !

[icionbricole]

A chaque nouvelle vidéo, ce gars change de tete ! lol

[GoddessofWarr]

C'est bizarre, car je suis correctement le tuto et j'ai des erreurs en console = Uncaught TypeError: target.removeAttribute is not a function
Ca parle de probleme de navigateur sur Google ?