tengo un boton Cuando el usuario hace clic en el botón, muestro el video en un modo emergente. Pero cuando hago clic fuera de la ventana emergente, la ventana emergente se cierra pero el video sigue reproduciéndose en segundo plano y también cuando cierro la ventana emergente sin pausar el video, sigue reproduciéndose en segundo plano.

Cómo detener la reproducción del video en segundo plano y restablecer el inicio del video cuando se cierra la ventana emergente o cuando hacemos clic fuera de la ventana emergente.

He agregado este código en el generador de páginas para reproducir videos en la ventana emergente

 <button type="button" class="action" data-trigger="trigger"> <svg xmlns="https://www.w3.org/2000/svg" width="64" height="64" viewBox="0 0 24 24"><path d="M12 2c5.514 0 10 4.486 10 10s-4.486 10-10 10-10-4.486-10-10 4.486-10 10-10zm0-2c-6.627 0-12 5.373-12 12s5.373 12 12 12 12-5.373 12-12-5.373-12-12-12zm-3 18v-12l10 6-10 6z" style="fill:#fff" /></svg> </button> <div data-bind="mageInit: { 'Magento_Ui/js/modal/modal':{ 'type': 'popup', 'trigger': '[data-trigger=trigger]', 'responsive': true, modalClass: 'nursery-modal', 'buttons': [{ class: 'action' }] }}"> <div class="content"> <iframe width="560" height="315" src="https://www.youtube.com/embed/PRajg7kFcZQ?autoplay=0" title="YouTube video player" frameborder="0" allow=accelerometer; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </div> </div>