Video background do not play on safari

[obemer]

Hello Alvaro,

Sorry to bother you with this,

Do you have any idea why the video autoplay works one time out of ten loadings in Safari ?
Even on your page: https://alvarotrigo.com/fullPage/examples/videoBackground.html

I get this on the console:

[alvarotrigo]

Can you try using the latest version?
Try using this demo:
https://codepen.io/alvarotrigo/pen/pXEaaK

https://alvarotrigo.com/fullPage/examples/videoBackground.html

This page is not using the latest fullPage.js version

[obemer]

Thank you for your answer.

The video in section 3 is not autoplaying and I got this in the console.

My Safari is up to date, and I have no specific settings for any websites.
I'm guessing you don't have this problem ?
Weird...

[obemer]

I'm asking because I'm having this issue on my website too.

[alvarotrigo]

I've tested it using browserstack.com and Safari 16.3 and it seems to be working just fine.

The error message on your screenshot says "possible because the user denied permission", so I'd check your browser configuration to make sure you allow auto playing videos.

You can also try from different computers to see if you get any problem in those and discard the possibility of being a configuration on your current browser.

Another thing you can try is adding the attribute playsinline to your video element, so instead of this:

 <video width="400" controls muted data-autoplay>

You use:

 <video width="400" controls muted data-autoplay playsinline>

[obemer]

Yes, I already have the playsinline in the video element.
But I still have the problem.

The weird thing is that the autoplay works if I leave the section and then go back to it.
I'll investigate further.

Thank you for your answer.

[alvarotrigo]

The weird thing is that the autoplay works if I leave the section and then go back to it.

Try to isolate the issue and remove fullPage.js from the equation.

Chances are this is a JS/HTML problem rather than a fullPage.js one.

You can play with this codepen and modify it to make some tests:
https://codepen.io/alvarotrigo/pen/bGmwGrr

[obemer]

Well,

It's not working either on an other Mac I tried.
It's driving me crazy.

But you were right. It seems like it has nothing to do with fullpage.js

I'll try on stack overflow then.

Thanks for your help !