How can I stop HTML5 videos from playing in a Webflow modal when it is closed?

To stop HTML5 videos from playing in a Webflow modal when it is closed, you can use JavaScript to control the video playback and pause it when the modal is closed. Here's an example of how you can achieve this:

1. Give your modal wrapper element a custom class name. For example, let's name it "modal-wrapper".

2. Add an event listener to the modal close button or overlay to detect when the modal is being closed. You can use the Webflow interactions panel to add custom code to trigger when the modal closes.

3. In the custom code section, write a JavaScript function that will find the video element inside the modal wrapper and pause it.

```javascript
function pauseVideoInModal() {
var modalWrapper = document.querySelector('.modal-wrapper');
var video = modalWrapper.querySelector('video');
if (video) {
video.pause();
}
}
```

4. Call the `pauseVideoInModal()` function when the modal is closed.

```javascript
// Inside the Webflow interactions code
$('.modal-wrapper').on('click', function() {
// Your modal close code here
// ...

 // Call the function to pause the video pauseVideoInModal();

});
```

This code uses the `querySelector` method to find the modal wrapper element and then searches for the video element within it. If a video element is found, the `pause()` method is called to pause the video playback.

Make sure to replace the `.modal-wrapper` and `'video'` selectors with your own class names or IDs if you're using different ones.

By implementing this solution, the video will automatically pause when the modal is closed, reducing unnecessary bandwidth usage and preventing any audio or video playback issues.