Multiple videos in one scene. When starting one stopping the others

Elements Audio & Video
1

Hello.
I'm creating a microsite with multiple videos in one scene.

When I started the fist video and want to watch the second video both videos play along and I get some Cacophony.

I want the first video (and 3rd and 4th...) to stop when I start the second video so on that only one video is playing at the same time – like on YouTube.

Thanks for your help!

2

I think this is what you're looking for https://pretagteam.com/question/how-to-pause-a-video-when-another-videos-play-button-is-clicked

There must be prettier vanilla options too, but this gets the job done (So don't forget to add jquery in the header).

Example file:
Video_pause.hype.zip (916.7 KB)

1 Like
3

thank you. I’ll try. But so far it looks like that’s too hard for me
I thought this behaviour is a much more basic function., Aaww

4

There's nothing else built in, so @BannerMan's solution is probably the best way to go.

The steps to replicate it would just be:

  1. Select any video element you want with this behavior and in the Identity Inspector add a Class Name of player
  2. In the Document Inspector, click Edit Head HTML and add this line:
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
  3. In the Scene Inspector, add an On Scene Load action set to Run JavaScript… with this code:
    $(document).ready(function () {
    function playFile() {
        $(".player").not(this).each(function () {
            $(this).get(0).pause();
        });
        this[this.get(0).paused ? "play" : "pause"]();
    }

    $('.player').on("click play", function() {
        playFile.call(this);
    });
})

That should be all there is to it. It will only work with video elements. If you're using youtube/vimeo/other sources then you'd need a different (and likely much more complicated) solution.

1 Like