Gratuit : Créer un player vidéo avec fonctionnalité de looping
Problème de lecture
Cette vidéo ne semble pas disponible
00:00
00:00
Sous-titres non disponibles
30m17
de formation
12
leçons vidéo
1
chapitre
Intermédiaire
niveau requis
Codeconcept
Codeconcept
Formateur

Gratuit : Créer un player vidéo avec fonctionnalité de looping

4.8/5 Trustpilot (1385 avis) Visionnage immédiat
30m17
de formation
12
leçons vidéo
1
chapitre

Un client (ou votre chef de projet) vous a demandé un player vidéo avec un gros plus : une fonctionnalité de loop entre un point A et B ? Ce tuto gratuit en vidéo va vous permettre de voir comment vous y prendre pour ajouter ce cette fonctionnalité de boucle à un player video. Et ce, grâce à JavaScript (sans framework ni librairie).

Je reste disponible dans le salon d'entraide pour répondre à vos éventuelles questions. 
Si vous souhaitez aller plus loin avec Javascript, je propose une formation complète remplie d'ateliers pratiques !

Qu’allez-vous apprendre dans ce cours ?

Plan de cours
Leçon 1
Demonstration du projet de vidéo player abec AB loop
Leçon 2
Lire une vidéo à l'aide de l'élément HTLM "vidéo"
Leçon 3
Ecouter l'événement timeupdate et suivre le currentTime
Leçon 4
Afficher la durée de vidéo écoulée
Leçon 5
Récupérer le currentTime pour les points A et B
Leçon 6
Looper entre les points A et B
Leçon 7
Remettre à zéro

Table des matières

Leçon 1

Demonstration du projet de vidéo player abec AB loop

01m18
Leçon 2

Lire une vidéo à l'aide de l'élément HTLM "vidéo"

02m24
Leçon 3

Ecouter l'événement timeupdate et suivre le currentTime

03m15
Leçon 4

Afficher la durée de vidéo écoulée

01m11
Leçon 5

Récupérer le currentTime pour les points A et B

02m25
Leçon 6

Looper entre les points A et B

02m16
Leçon 7

Remettre à zéro

01m47
Leçon 8

Afficher les points A et B choisis

02m09
Leçon 9

Afficher un indicateur de looping

02m16
Leçon 10

Créer une fonction de formattage de durée écoulée

06m42
Leçon 11

Masquer les contrôles lorsque l'on loop

01m57
Leçon 12

Refactorisation et conclusion

02m37

Avis des apprenants

Détail des avis
227
Apprenants
1
Commentaire
4/5
Note moyenne
5/5
0
4/5
1
3/5
0
2/5
0
1/5
0
Serge Dutilleul
Serge Dutilleul
Publié le 26/10/2019
Vidéo bien faite et bien explicative. Quelques regrets tout de même. - Les vidéos ne sont pas dans le bon ordre. - Le choix de la vidéo sur laquelle on va looper n'est pas, à mon avis, très judicieux. Il y a du code dedans. Ainsi, on ne sait pas bien si on voit du code de la vidéo à looper ou du code que l'on est en train d'étudier. - La modification du display du span spanLoop a été mise à block puis a été changée en inline sans que cela soit mentionné dans la vidéo (ou alors j'ai loupé) - Ne reste-t-il un souci si on clique sur B avant d'avoir cliqué sur A ? Dans la partie du clic sur B, il faudrait peut-être tester que A n'est pas égal à -1 avant d'exécuter les instructions. Merci pour la vidéo.
Codeconcept
Merci Serge d'avoir signalé le problème d'ordre: C'est corrigé! Désolé ça n'a pas du être facile à suivre. Je prends bonne note des autres remarques constructives pour les prochains tuto ;)

Vos questions sur le cours

Quel est le niveau requis pour suivre ce tuto ?

intermédiaire

Formations complémentaires

Les apprenants qui suivent cette formation s'intéressent aussi à :

Attendez ! 🤗

Accédez à plus de 1420 tutos gratuits

Notre politique de protection des données