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();
}
});
});
});
});