Video play issue on iPad mode

1

Hello
There are eight videos on one project, and these videos work on both PC and mobile mode, but not work on iPad mode,

831611889437_.pic_hd
831611889437_.pic_hd1604×1014 305 KB

and here is what I used in Hype document:

<video id="monitor" preload="none" loop="" muted="" webkit-playsinline="" autoplay="" controls="" style="width: 100%; height: 100%; position:left">
<source src="https://www.elegantthemes.com/videos/previews/build.mp4">
Your browser does not support the video tag.
</video>

and here is the live page at https://inlady.net

Would you please let me know what I missed please?

Thanks in advance.

2

Did you resolve the issue? It seems to work for me using the responsive mode setup like you have.

The console logs (which I do not see) indicate a 403 error - which is that there is a permissions error with the files; you will likely just need to change permissions on the web server.

3

Hi @jonathan,

Thanks for reply.

I changed videos from cloud server to Local server, but there are some error at console:

[Error] Button failed to load, iconName = airplay-placard, layoutTraits = 1, src = data:image/png;base64,
	handleEvent (Anonymous Script 6 (line 1827))
[Error] Button failed to load, iconName = pip-placard, layoutTraits = 1, src = data:image/png;base64,
	handleEvent (Anonymous Script 4 (line 1827))

Screenshot:

or you might like to check the live site page

It would be great if you could let me know what does those errors mean.

Thanks

4

The error is about a video element is having difficulty drawing the little control icons for airplay and picture-in-picture. Technically Safari implements video controls as HTML itself, which is why errors like these show up in the console.

I don't see them myself when testing your site in responsive mode. It probably isn't your error, but just something config-based Safari is choking on.