Preventing default full-screen video on iPhone & iPod Touch

The iPhone and iPod Touch handle video differently than an iPad, automatically defaulting to playing all video full-screen within the native iOS video player. This can be problematic for a kiosk application as it can be disorienting to a kiosk visitor.

Specific coding can be added in order for your video to play inline within your page, eliminating these issues. To play video inline on an iPhone or iPod Touch in Kiosk Pro, you'll need to include the tag 'webkit-playsinline' in the video player like this:

<video src="video.mp4" webkit-playsinline></video>

If you do not want the video to have controls (play, pause, etc.), you will either need to use the autoplay tag to trigger the start of the video or make a custom play button with JavaScript.

If you use the 'controls' tag in the video player, the standard iOS control bar includes a full-screen option which opens the native video player (and prevents the idle timer from timing out.)

Still stuck? How can we help? How can we help?