First Video sound playing on carousel on second video


Topic: First Video sound playing on carousel on second video

davidpadua pro asked 4 weeks ago

Hello I made a video carousel with your component for my website with react and I want to go to next video but the previous one does not stop and the sound stays on top of the other. Is there a way to stop the video when I change videos on carousel? Thank you for the help.

You can see the effect here, on videos link: https://www.davidpadua.com/projects/react-caladowood/ As you can see, when I change to the second video, the sound of the first remains playing and that's not what I want.

Thank you for the help. I'm using React free package.


Wojciech Staniszewski staff commented 4 weeks ago

Hi!

When I check Your page, everything seems to work correctly, the previous video stop after the switch. If the problem still occurs, please send some code or instructions on how to recreate Your problem.

Best regards


davidpadua pro commented 4 weeks ago

That's because I added a workaround to make this work:

on the MDBCarousel component:onClick={stopVideo}then added the class .carousel-video to the the elements that were added dynamically and in the function stopVideo:

const stopVideo = () => { const myVideos = document.querySelectorAll(".carousel-video"); myVideos.forEach(vid => { vid.pause(); vid.currentTime = 0; }) }

That resolved the problem. But it would be nice if the carousel itself had an option built in to stop the videos when we click next or previous.

Thank you for the response.

P.S. the problem still occurs without that workaround.


Wojciech Staniszewski staff commented 4 weeks ago

We will consider adding this feature in the next release. Thanks for your suggestion


Please insert min. 20 characters.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: React
  • MDB Version: 5.0.1
  • Device: web
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: Yes