Video Background not working on iphone safari - Forum | JoomShaper
Staff replied SP Page Builder

Video Background not working on iphone safari

Asked by Dave 5 years ago Last activity 4 years ago

Hello, when usging the sp page builder addon Slideshow, mp4 video are not working.

Any solution to this?

Thanks
Davide

5 replies

Oldest first Newest first Most helpful
Anne Staff
5 years ago

Hello there,

Thanks for contacting with us. Please, attach a screen record about this. Please share your administrator access here to check the issue. Use the Hidden Content box to share the credentials.

Best regards

Muntasir Sakib Staff
5 years ago

Hello there,

This is not a problem of our product. This is a common problem for developers around the world. What would make it work background video on smartphones and in all browsers requires non-standard js tricks.

No to mention, if you google this subject, you will realize the scale of the problem. In addition, the companies Google and Apple have a policy prohibiting autoplay video for all new device models. In any case, use a video background is very bad for page speed load on mobile devices.

The best way is to completely abandon the background video on mobile devices.

Thanks!

Dave Asked this
5 years ago

Hello. Thanks for your consideration.

A video starting in the background should not be a problem. As long as the video is optimized and delivered from a good combination of server / streaming service it is a good element to have.

The video background is working well on desktop. I just need the functionality to not be stopped on mobile.

In the following website there is a Slideshow addon. The second slide is a video (about 5MB) and on desktop is working really well. I need to do the same on mobile please.

https:// www. baglem .com

Is there a way i can remove the mobile block?

Thanks

baloe98
4 years ago

I have a solution for this problem.

  1. Use the video addon in a new row. Use MP4 videos. Play video in a loop, Mute video, Autoplay video.
    Row options Padding and Margin all 0px.

  2. Add a new row under the video row . Here you can put text or whatever.
    Adjust the margin of the row in TOP: -400px for example.
    The row will now be over the video.
    You can use a row animation effect if you want.
    Adjust the margin for tablet and phone.

  3. The video with text / photo will now also be visible on an IPhone.

Anne Staff
4 years ago

Hello baloe98

Thanks for sharing the information with us.

-Regards

Log in to reply.