vidéo.js
Unknown
Video.js est un lecteur vidéo open source complet pour toutes les plateformes Web.
Dès la sortie de la boîte, Video.js prend en charge tous les formats multimédias courants utilisés sur le Web, y compris les formats de streaming tels que HLS et DASH. Il fonctionne sur les ordinateurs de bureau, les appareils mobiles, les tablettes et les Smart TV Web. Il peut être étendu et personnalisé grâce à un solide écosystème de plugins.
Video.js a été lancé au milieu de l'année 2010 et est désormais utilisé sur plus de 50 000 100 000 200 000 400 000 700 000 800 000 sites Web.
Grâce aux gens formidables de Fastly, il existe une version gratuite et hébergée sur CDN de Video.js que tout le monde peut utiliser. Ajoutez ces balises au de votre document :
< link href =" //vjs.zencdn.net/8.19.1/video-js.min.css " rel =" stylesheet " >
< script src =" //vjs.zencdn.net/8.19.1/video.min.js " > script >Alternativement, vous pouvez inclure Video.js en l'obtenant depuis npm, en le téléchargeant à partir des versions de GitHub ou en l'incluant via unpkg ou un autre CDN JavaScript, comme CDNjs.
< link href =" https://unpkg.com/video.js/dist/video-js.min.css " rel =" stylesheet " >
< script src =" https://unpkg.com/video.js/dist/video.min.js " > script >
< link href =" https://unpkg.com/[email protected]/dist/video-js.min.css " rel =" stylesheet " >
< script src =" https://unpkg.com/[email protected]/dist/video.min.js " > script >
< link href =" https://cdnjs.cloudflare.com/ajax/libs/video.js/8.19.1/video-js.min.css " rel =" stylesheet " >
< script src =" https://cdnjs.cloudflare.com/ajax/libs/video.js/8.19.1/video.min.js " > script > Ensuite, utiliser Video.js est aussi simple que de créer un élément , mais avec un attribut data-setup supplémentaire. Au minimum, cet attribut doit avoir la valeur '{}' , mais il peut inclure n'importe quelle option Video.js - assurez-vous simplement qu'il contient du JSON valide !
To view this video please enable JavaScript, and consider upgrading to a web browser that supports HTML5 video
"> < video
id =" my-player "
class =" video-js "
controls
preload =" auto "
poster =" //vjs.zencdn.net/v/oceans.png "
data-setup =' {} ' >
< source src =" //vjs.zencdn.net/v/oceans.mp4 " type =" video/mp4 " > source >
< source src =" //vjs.zencdn.net/v/oceans.webm " type =" video/webm " > source >
< source src =" //vjs.zencdn.net/v/oceans.ogv " type =" video/ogg " > source >
< p class =" vjs-no-js " >
To view this video please enable JavaScript, and consider upgrading to a
web browser that
< a href =" https://videojs.com/html5-video-support/ " target =" _blank " >
supports HTML5 video
a >
p >
video >Lorsque la page se chargera, Video.js trouvera cet élément et configurera automatiquement un lecteur à sa place.
Si vous ne souhaitez pas utiliser la configuration automatique, vous pouvez laisser de côté l'attribut data-setup et initialiser un élément manuellement à l'aide de la fonction videojs :
var player = videojs ( 'my-player' ) ; La fonction videojs accepte également un objet options et un rappel à appeler lorsque le lecteur est prêt :
var options = { } ;
var player = videojs ( 'my-player' , options , function onPlayerReady ( ) {
videojs . log ( 'Your player is ready!' ) ;
// In this context, `this` is the player that was created by Video.js.
this . play ( ) ;
// How about an event listener?
this . on ( 'ended' , function ( ) {
videojs . log ( 'Awww...over so soon?!' ) ;
} ) ;
} ) ;Si vous êtes prêt à vous lancer, la page de démarrage et la documentation sont les meilleurs endroits où aller pour plus d'informations. Si vous êtes bloqué, rendez-vous sur notre Slack !
Video.js est une bibliothèque gratuite et open source, et nous apprécions toute aide que vous êtes prêt à apporter, qu'il s'agisse de corriger des bugs, d'améliorer la documentation ou de suggérer de nouvelles fonctionnalités. Consultez le guide de contribution pour en savoir plus !
Video.js utilise BrowserStack pour les tests de compatibilité.
Veuillez noter que ce projet est publié avec un code de conduite des contributeurs. En participant à ce projet, vous acceptez d'en respecter les termes.
Video.js est sous licence Apache, version 2.0.
Video.js est une marque déposée de Brightcove, Inc.
