How can I hide/disable the fullscreen button in the iPad’s standard HTML5 video controls?

Question

I’m writing an HTML5 page with a embedded video tag for the iPad.

How can I hide or disable the fullscreen button? I just need to show the video without the fullscreen option.

Answer 1

As far as I know (I could be wrong, this isn’t really my area), you can’t tell Safari how to render its standard video controls.

However, you can tell it not to render its standard video controls (at least according to the HTML5 spec) by omitting the controls attribute from the video tag.

You can then write your own play/pause controls. (See e.g. http://diveintohtml5.ep.io/video.html#markup). That’s obviously a bit more work, but I think it’s your only option.

If you don’t want to write your own controls from scratch, there are a couple of good pre-built ones out there, specifically:

• Video JS
• Video for Everybody

They’re more focused on providing video via HTML5 or Flash depending on browser capabilities, but you might be able to extract the control parts, or at least see how they’re doing it.