//boton botón con el cual cierro la ventana modal
<a data-bs-toggle="modal"
style='cursor: pointer;' id='videogumb' class='icon-
id='videogumb'
class='icon-play-card'
data-bs-target="#staticBackdrop-<?php echo $i;?>">
<img src="<?php echo get_field('miniatura'); ?>"
class="card-img-top"
style='width:100%; height: 300px; background-size:cover: background-position:
center center;'
center center;' alt="...">
</a>
//ventana Ventana modal dentro de un foreach, con el id='iframes' para funcionar con jqueryjQuery
<div
<div class="modal fade"
id="staticBackdrop-<?php echo $i;?>"
data-bs-
keyboard="false" tabindex="-1"
aria-labelledby="staticBackdropLabel-<?php echo $i;?>"
aria-hidden="true" >
<div class="modal-dialog modal-xl" >xl">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" style='color: white;' id="ModalLabel-<?php
id="ModalLabel-<?php echo $i;?>"><?php the_title(); ?></h5>
<button type="button"
<button type="button" class="btn-close" data-bs-dismiss="modal"
aria-label="Close"></button>
</div>
<div class="modal-body">
<div style="padding:50.24% 0 0 0;position:relative;"
class='video-responsive'>
<iframe class='pauseiframe' id='iframes'
src="https://player.vimeo.com/video/<?php echo
echo $videocolumns; ?
?>&badge=0&autopause=0&player_id=0&app_id=58479"
frameborder="0"
allow="autoplay; fullscreen; picture-in-
picture" allowfullscreen
allowfullscreen
style="position:absolute;top:0;left:0;width:100%;height:100%;"
title=""></iframe></div>iframe>
</div>
<script src="https://player.vimeo.com/api/player.js"></script>
</div>
</div>
</div>
</div>
//jquery jQuery para pausar el iframe del modal, y luego volver a mostrar el iframe al abrir otro modal
jQuery('.btn-close').on('click', () =>{
var $frame = jQuery('iframe#iframes');
// saves the current iframe source
var vidsrc = $frame.attr('src');
// sets the source to nothing, stopping the video
$frame.attr('src','');
// sets it back to the correct link so that
// it reloads immediately on
the next window open
$frame.attr('src', vidsrc);
});