Problems with video streaming site for iPhone
I have been trying to embed some videos on a website I am building, and have come across a snag when trying to stream the videos to iPhone/iPad.
Here's the code I use:
<video width="480" height="360" controls> <source src="/video/Fire.mp4" type="video/mp4" /> </video>
This displays a thumbnail with a play button on it. However, the play button is crossed out. (The invalid codec button?)
I have ensured that the video has been properly encoded (MP4, H.264, baseline).
Any suggestions on what I'm doing wrong?
I've been having a similar problem. A few things to check off before you assume the codec is the problem:
- Ensure the server is sending the video file with the correct MIME type (video/mp4)
- The video's bit rate is under ~2MBps, there is also a relationship with the max resolution you can use in conjunction with the bit rate.
I was also encoding mp4 video with the baseline profile using Adobe Media Encoder and could not get the video to play on an iPhone.
I used Miro Video Converter to convert from mp4 to mp4 and can now correctly play the video on an iPhone.
Obviously some part of the encoding I must be setting wrong from the Adobe software but I'm yet to pin it down.
If anyone else can chime in with there experience it would be appreciated.