Search code examples
htmlhtml5-videomov

Black screen when embedding .mov video on my website


So I'm trying to embed a .mov video to a website with the following:

<video src="myvideo.mov" controls></video>

the video when played shows a black screen and all I hear is the audio.

Tried with several videos with same .mov extension but nothing works, what am I doing wrong?


Solution

  • You cannot see the video because, in HTML 5, there are only 3 video types that are supported:

    1. .mp4
    2. .webM
    3. .ogg

    If you want the video to be shown, you need either of the video type.

    What you can do is:

    1. Change the current video type to the either of above video type

    Once done, you can then update your code to this:

    <video src="path/to/video-file.mp4" controls>
      Your browser does not support the <code>video</code> element.
    </video>
    

    For more information on video element, refer this link and this link