I am trying to play a video after clicking an element, but the sound on iOS devices won’t play.
It seems there has to be some special requirements with iOS to play Video with sound, as stated here.
As far as I can see it neither works in Saola with “Play Media” nor with “Play Timeline”. Is there anybody out there who could help me with that? I don’t know how to implement the required “onclick()” within Saola.
I attached a very simple saolapackage for someone who might help. It’s just a video that should start with sound on iOS when clicking a shape element.
I have been working for a week now to setup my animation and it works on all devices but iOS. So I’d appreciate help very, very much! Thanks a lot.
Recent changes in iOS 14 and macOS Big Sur cause this issue. We’ll fix it in version 3.
Now you can use the following script to play the video with sound on iOS:
var media = doc.getElement('Video_1').mediaDom;
media.muted = false;
media.load();
media.play();
it seems I have another issue with your proposed solution (media.muted = false) now:
media.load() seems to takes its time so the start is out of sync with the timeline.
I read that Saola V 3.0 will address the video issues on iOS, but I wonder which mechanism this might be. As far as I can see, there is no chance to play video with sound on iOS without calling media.load(), then media.play().
Modern browsers doesn’t allow playing audio (or sound in video) automatically without user interactions.
Saola 2 mutes the sound at the beginning so that it can be played muted, it’ll be unmuted when the user clicks on the scene.
But in iOS 14, sound can’t be unmuted if it was muted when its metadata is not loaded yet.
Saola 3 waits for the metadata to be loaded then mutes the sound so this issue will not occur.
This method is better than the workaround for Saola 2, but it still doesn’t ensure a correct sync between the media and the timeline.