Prevent playing multiple Videos at the same time

Hi
Currently, if we have multiple videos on a single page, when a user plays the next video, the previous video is not stopped playing which is bad UX.

Currently, I fixed this with this code, but please solve this problem.
Kind Regards.

document.addEventListener('DOMContentLoaded', function () {
    // Select all video elements on the page
    const videos = document.querySelectorAll('video');

    // Add an event listener to each video
    videos.forEach((video) => {
        video.addEventListener('play', () => {
            // Pause all other videos when one starts playing
            videos.forEach((otherVideo) => {
                if (otherVideo !== video) {
                    otherVideo.pause();
                }
            });
        });
    });
});

1 Like

Hi.

I’ve moved this to feature requests / improvements, as this is not really a bug.
I agree, this could be a nice addition to have.

Feel free to add it to the idea board: Idea board – Bricks

Matej

1 Like