Search code examples
htmlvideosafarivideo-streamingh.264

HTML5 video only plays audio and won't preload on Safari?


I'm using videoJS for html5 video. It works perfectly on all browsers except on Safari. It does not play video, only audio, and it will not play anything until the entire file has downloaded. I copied and pasted the code from videojs.com so I'm at a loss for what to do. Any help is greatly appreciated!

Website: http://bit.ly/P99RhM

P.S. The files won't play on any mobile device either... any ideas on why? I was thinking something is wrong with the compression, but it's in h.264 already. Thanks!


Solution

  • I think your video is webM, isn't it? I was checking your website.

    1 - to play on iPhone, use h.264 with MP4 format and moov atom placed at the beginning of the file. Handbrake is a good software to do so.

    2- h.264 files have an indexing section which is called moov atom. This is a small indexing part which says to player which byte is for which second of the video.

    moov atom can be either at the beginning of the file or at the end. By placing it at the beginning you will able your player to seek in the file before the whole video is downloaded.

    In Handbrake you can place atom moov at the beginning by selecting the checkbox: "web optimized"

    or if you already have a MP4 file try using this.