IdentifiantMot de passe
Mot de passe oublié ?Je m'inscris ! (gratuit)

Vous êtes nouveau sur Developpez.com ? Créez votre compte ou connectez-vous afin de pouvoir participer !

Vous devez avoir un compte Developpez.com et être connecté pour pouvoir participer aux discussions.

Vous n'avez pas encore de compte Developpez.com ? Créez-en un en quelques instants, c'est entièrement gratuit !

Si vous disposez déjà d'un compte et qu'il est bien activé, connectez-vous à l'aide du formulaire ci-dessous.

Identifiez-vous
Identifiant
Mot de passe
Mot de passe oublié ?
Créer un compte

L'inscription est gratuite et ne vous prendra que quelques instants !

Je m'inscris !
Créer un lecteur vidéo personnalisé avec CSS3, HTML5 et JavaScript
Par Johnny Simpson
Le , par Bovino
5  0 


Je vous propose une traduction de l'article anglophone Making Custom CSS3 Video Players With HTML5 and Javascript publié par Johnny Simpson sur son blog InsertHTML.

N'hésitez pas à faire part de vos remarques, commentaires ou améliorations éventuelles.

Créer un lecteur vidéo personnalisé avec CSS3, HTML5 et JavaScript.

  • Doksuri
    Expert confirmé
    deterrer un script de plus de 7ans et s'etonner qu'il ne fonctionne pas du 1er coup en faisant un copier/coller sans chercher plus loin....

    si au moins vous preniez la peine de nous donner le message d'erreur sour firefox...
    le 23/07/2020 à 17:46
    2  0 
  • Doksuri
    Expert confirmé
    je vois qu'il y a pas mal d'erreurs liees a des extensions, avez-vous essaye la page en navigation privee (sans les extensions) ?
    le 24/07/2020 à 11:48
    1  0 
  • Parfaitement parfait !

    Mais je suggérer de rajouter un bouton play au milieu de la vidéo quand elle stoppé, un peu comme sur youtube. Mais bon c'est juste une suggestion.

    Franchement chapeau, le design et tout !
    le 24/04/2013 à 13:07
    0  0 
  • Vulci
    Membre à l'essai
    Bonjour !

    Super tutoriel, merci encore pour sa traduction !
    Néanmoins, l'utilisant avec un collègue, nous nous sommes heurtés à un problème de taille, le player du lecteur bug sous Firefox.
    Il n'apparaît pas à chaque fois. néanmoins, aucun soucis sous Chrome.

    Ce bout de code fait partie d'un projet de taille.
    Ainsi, si vous avez une solution, une idée, ou avez envie de prendre 10min de votre temps pour copier coller le code et essayer de voir pourquoi cela ne marche pas, moi et mon collègue nous vous serions vraiment reconnaissant.

    merci pour votre travail,
    Bonnes continuations
    Guillaume
    le 23/07/2020 à 17:30
    0  0 
  • Vulci
    Membre à l'essai
    Quelle amabilité, bonjour à vous aussi !

    Déjà de 1, ce ton est inapproprié, ce tuto est le seul sur lequel on tombe pour réaliser cela
    De 2, inutile de parler sans rien savoir, il n'a jamais été dit que le code avait été copié collé sans réflexion, donc réponse inadaptée
    Et pour finir, qui a parlé d'une erreur sur Firefox ? J'ai simplement dit que le player ne s'affichait qu'une fois sur plusieurs lancements, à des rythmes irréguliers, pas que cela provoquait une erreur.

    Nous avons évidemment modifié l'entièreté du code pour que cela convienne à nos attentes, mais maintenant comme avant les modifications d'ailleurs, cela ne tourne que dans 10 à 15%des lancements sur Firefox

    J'ai simplement posé une question, à laquelle j'espèrais obtenir une réponse basée sur autre chose que des inventions et des suppositions.
    Pour me répondre cela avec autant d'envie d'aider, autant se taire.
    le 23/07/2020 à 23:30
    0  0 
  • Doksuri
    Expert confirmé
    Citation Envoyé par Vulci Voir le message
    nous nous sommes heurtés à un problème de taille, le player du lecteur bug sous Firefox.
    Il n'apparaît pas à chaque fois. néanmoins, aucun soucis sous Chrome.
    c'est vrai, c'est moi qui ai mal interprete cette phrase, il n'y a aucun probleme...

    Citation Envoyé par Vulci Voir le message
    cela ne tourne que dans 10 à 15%des lancements sur Firefox
    ce n'est absolument pas du a une erreur

    Citation Envoyé par Vulci Voir le message
    pas que cela provoquait une erreur.
    avez-vous au moins affiche la console pour confirmer ca ?
    le 24/07/2020 à 7:03
    0  0 
  • Vulci
    Membre à l'essai
    Nous avons essayé d'afficher la console d'Erreurs de Firefox ducoup suivant ce que vous venez de conseiller
    De mon côté, aucune erreur (et pourtant ça marche pas), mais mon collègue a ça :



    Le truc c'est que le code a aucune raison de planter, le css a été drastiquement réduit pour éviter l'appel à des méthodes qui ne fonctionneraient pas, et de même pour le Javascript qui a été grandement modifié (vis à vis de ce dont on a besoin mais aussi pour essayé de localiser ce qui ne plaît pas à firefox).

    Dans le cas d'une erreur, elle devrait se produire tout le temps, rien ne change entre nos différents lancements, rien du tout, et pourtant desfois ça passe.
    Cela n'empêche en rien le Javascript de fonctionner, on continue (par le biais d'autres boutons interagissant avec), d'avoir accès à la vidéo, tout fonctionne, play/pause avance rapide etc... c'est vraiment juste dans l'apparition de cette satanée barre de player qu'il y a un soucis, et pas toujours.

    J'ai écris ici dans l'espoir de rencontrer qqn qui avait essayé ce tuto, et qui se heurtait à ces problèmes aussi...
    Le but était pas de déranger, ni d'arriver les mains dans les poches, soyez sûrs qu'on a cherché avant de débarquer ici
    le 24/07/2020 à 10:30
    0  0 
  • Vulci
    Membre à l'essai
    Merci pour votre idée brillante, cela fonctionne en navigation privée environ 95% des fois ! C'est déjà une bonne chose !
    Savez vous ce qu'on devrait changer vis à vis de ces erreurs pour que cela fonctionne en navigation normale ?

    Merci de votre aide
    le 24/07/2020 à 13:59
    0  0 
  • Doksuri
    Expert confirmé
    quelles sont les erreurs sans les autres extensions ? (quand ca ne fonctionne pas)

    perso : les extensions installees sont de la responsabilite du client... si ca fait tout planter, c'est pas mon probleme car elles alterent le comportement de base de la page
    le 24/07/2020 à 16:18
    0  0 
  • Vulci
    Membre à l'essai
    J'entends bien, merci de votre aide, écoutez si sans vous prendre trop de temps vous arrivez à comprendre ce qui déconne alors on prend, sinon..je ne sais pas..dans tous les cas nous ne sommes pas assez expérimentés pour savoir ce qui déconne par nous même dans ce genre de problème ..
    Ci joint en premier le screen des erreurs quand cela fonctionne (48 fois sur 50 en nav privée)

    Ci joint le screen des erreurs quand cela ne fonctionne pas
    le 24/07/2020 à 16:53
    0  0 
  Poster une réponse