Question

I’m developing an HTML5 application (a game), that automatically preloads 5 video files. I’m able to do so correctly on Safari for PC, so there are no overlooked problems with file formats, codecs or such. The load fails on an iPad. As an official guide for video on iOS puts it:

This means the JavaScript play() and load() methods are also inactive
until the user initiates playback, unless the play() or load() method
is triggered by user action. In other words, a user-initiated Play
button works, but an onLoad=”play()” event does not.

Does this mean, that I have no means to initiate the loading of video after a user initiated action, if that action hasn’t been tied to a video element (user clicked on a regular div — I request loading and displaying of a video, compared to the user actually clicking on a video element to load and play that particular element)?

Answer 1

After further inspection, it turns out, that video.load() and video.play() methods can be called from any onClick handler for any <div> element (that probably stays true throughout every html element, that can receive click events.

The problem with preloading 5 video files on iPad is that it can only preload 1 and will flush any video data, if new video.load() request for a different video is issued, thus you cannot preload 5 videos, but you can make them into single one and then preload that single video.