Questions tagged [video.js]

Video.js is an open source JavaScript framework for embedding and working with HTML5 and Flash video. It uses the HTML5 video tag as an embed code, and has a common HTML/CSS skin and API for both HTML5 and Flash.

What is ?

Video.js is an and library that makes it easier to work with and build on . This is also known as an HTML5 Video Player. it's licensed under the Apache License, Version 2.0. View the license file.

Video.js provides a common controls skin built in HTML/CSS, fixes cross-browser inconsistencies, adds additional features like fullscreen and subtitles, manages the fallback to Flash or other playback technologies when HTML5 video isn't supported, and also provides a consistent JavaScript API for interacting with the video.

It can be extended to work with additional players, like YouTube and QuickTime. Video.js also support HLS, 360 degree, live streaming and panorama videos.


Resources

2234 questions
8
votes
3 answers

How can I make a full width videojs v5 progress bar?

I would like to change the videojs v5 controls layout in order to make a full width progress bar, on top of the vjs-control-bar area, similar to the pre-v5 player skin. Here is the v5 skin: And here is the pre-v5 skin. Notice the full width…
Billybobbonnet
  • 3,156
  • 4
  • 23
  • 49
8
votes
3 answers

How to create customs button in video js

I want to create custom button in video js i have tried so many things and search alot when i am applying i found no result i think i have some mistake in my code. i have setup my player on video js successfully. This my code which i am trying to…
Sufyan
  • 506
  • 2
  • 6
  • 18
8
votes
6 answers

video.js - find the start time of a seek during playback

I am using video.js (http://www.videojs.com/) to build a video approval system and need to log user actions in the player. I can do this easily enough with play, pause, end etc. but have hit a problem when trying to log seeks. I want to be able to…
Dave The Butcher
  • 103
  • 1
  • 1
  • 4
8
votes
2 answers

How can I listen for the "timeupdate" event from my video.js player?

While I have been able to listen for the "timeupdate" event with a vanilla HTML5 player, I can't seem to get it to work with video.js. Here's my code:
coyote
  • 326
  • 2
  • 4
  • 11
8
votes
5 answers

ReactJS can't change video and poster videojs

I want to change video poster and source VideoJS when selectedVideo changed var VideoPlayer = React.createClass({ render: function() { var selectedVideo = this.props.selectedVideo; function filterVideo(video) { return video.id ==…
Andri Kurnia
  • 2,148
  • 1
  • 13
  • 13
8
votes
2 answers

Video.js youtube video

I can't get youtube video to work with video.js I added in the head : Then in the body :
8
votes
3 answers

When using video.js, why doesn't the full-screen button work inside an iframe?

I use video.js for video play. When not using an iframe, clicking the full screen button works as expected. However, when using an iframe, the full screen button doesn't work. Why is this? The homepage of video.js is http://videojs.com/ the code…
caizy20
  • 81
  • 1
  • 1
  • 4
7
votes
1 answer

VideoJS has no quality level / can't select qualities despite overrideNative in Safari desktop

I am building a NextJS site that plays HLS videos. TLDR; how to override Safari's native HLS engine? What are the player options needed? Mine (below) did not work! To switch between qualities, I am using:…
Sean Saoirse
  • 91
  • 5
  • 17
7
votes
1 answer

browser autoplay policy. How does autoplay work in Netflix?

I've developed an application like netflix which streams video. I'm working with video.js. when I try to play unmuted video, it throw error says that "Uncaught (in promise) DOMException: play() failed because the user didn't interact with the…
7
votes
2 answers

Sending origin cookies in Cors not working with VideoJS

I have the following subdomains: stream.example.com sub.example.com Both domains have SSL certificates and are valid. I am using videoJS 7.6.6 which has http_streaming library. On sub.example.com , there is a video tag which sets a dash manifest…
user2650277
  • 6,289
  • 17
  • 63
  • 132
7
votes
3 answers

How to make videojs marker slidable or movable

I want to move my markers whenever it is slided along with the seek. I expect my markers to be exactly slidable as jqueryui-slider Question: I want my markers(both) to be as slidable as jqueryui-range slider as shown below the video in the…
EaBengaluru
  • 131
  • 2
  • 17
  • 59
7
votes
3 answers

How to hide/disable buttons controls in videojs?

I have application with video.js and vue. I try to find a way to hide or disable those controls: play button, playback rate, and make the progress bar readonly. I the video.js docs there is controls: false which hide all controls bar. and this is…
Jon Sud
  • 10,211
  • 17
  • 76
  • 174
7
votes
4 answers

How do I add multiple audio tracks from my array list

I want to have multiple audio tracks for a single video file similar to this one https://codepen.io/eabangalore/pen/NZjrNd (they are using their own js with videojs) I have list of sound tracks that I want to switch: var usersAudioTrackList = …
EaBengaluru
  • 131
  • 2
  • 17
  • 59
7
votes
2 answers

How does VideoJS determine when to use HLS vs MP4 video when both sources are available?

I have a video encoded in MP4 as well as HLS (m3u8)format. I want VideoJS to use MP4 for desktops browser vs m3u8 for devices . The latest version of VideoJS supports both formats . I am trying to determine if videojs can automatically figure out…
user193116
  • 3,498
  • 6
  • 39
  • 58
7
votes
2 answers

How to generate video preview thumbnails for use in VideoJS?

I moved over to VideoJs (html5) and need to figure out how to generate thumbnails for the seekbar. I have tried using videojs-thumbnails, however that requires having a preloaded vtt file with a sprite image. I'm trying to figure out a way to…
steven
  • 508
  • 1
  • 8
  • 23