Search code examples
google-chromevideohtml5-videoquicktime

Chrome showing a different video controls bar for type video/quicktime

Anyone knows why Chrome is showing a different controls bar for a .mov file type video/quicktime (codecs: Timecode, Linear PCM, Apple ProRes 422 HQ) and how can I get it back to the default one? Tried with a different .mov file (a QuickTime screen capture, different codecs) and it showed normally.

screenshot:

1

Solution

  • You are seeing the audio controls because Chrome only understands the audio part (codec) of your file. You can recreate the same issue by loading some file into an <audio> tag:

    <audio controls> <source src="testfile.mp3" type="audio/mpeg"> </audio>

    The problem happens because the ProRes video codec is not supported by Google's Chrome browser. The codec, created by Apple, only works in their Safari browsers (eg: Chrome did not license it from Apple).

    Solution:
    Use a Chrome-supported video codec inside an MP4 / MOV / WebM video file. Options are:
    Use .MP4 or .MOV with H.264 and AV1 codecs, or else use .WEBM with VP8 or VP9 codecs.