0 C'est gratuit

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

0 C'est gratuit

  • Une formation vidéo de 30m17s
  • Téléchargement immédiat et visionnage illimité à vie
  • Satisfait ou remboursé
  • Découvrez pourquoi vous former avec Tuto.com

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 !

Table des matières de cette formation JavaScript (durée : 30m17s)

    • Demonstration du projet de vidéo player abec AB loop gratuit 00:01:18
    • Lire une vidéo à l'aide de l'élément HTLM "vidéo" 00:02:24
    • Ecouter l'événement timeupdate et suivre le currentTime 00:03:15
    • Afficher la durée de vidéo écoulée 00:01:11
    • Récupérer le currentTime pour les points A et B 00:02:25
    • Looper entre les points A et B 00:02:16
    • Remettre à zéro 00:01:47
    • Afficher les points A et B choisis 00:02:09
    • Afficher un indicateur de looping 00:02:16
    • Créer une fonction de formattage de durée écoulée 00:06:42
    • Masquer les contrôles lorsque l'on loop 00:01:57
    • Refactorisation et conclusion 00:02:37



Formateur : Codeconcept

Codeconcept a publié 16 tutoriels et obtenu une note moyenne de 4,6/5 sur 215 tutoriels vendus. Voir les autres formations de Codeconcept

4,0
note moyenne

1
avis laissé
5 étoiles
0
4 étoiles
1
3 étoiles
0
2 étoiles
0
1 étoile
0
  • 4
    avis de serge13007 laissé 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.
    "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 ;)"

  • Avec quelle version de logiciel ce tuto est-il compatible ?
    ECMAScript 6.X
  • Quel est le niveau requis pour suivre ce tuto ?
    intermédiaire
accédez à plus de 1239 tuto gratuits


non, je ne veux pas me former gratuitement

voir notre politique de protection des données