Solucionar problema audio al cerrar ventana modal con video

  • Autor Autor satanson
  • Fecha de inicio Fecha de inicio
satanson

satanson

Gamma
Verificado
Verificación en dos pasos activada
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola betas, estoy creando una pequeña ventana para colocar videos en position fixed, pero cuando cierro la ventana se sigue escuchando el audio. Alguien me puede decir como lo soluciono?. Mas abajo dejo las lineas de codigo.

HTML: 
<script type="text/javascript">
 function closeDialog() {
        let d = document.getElementById("modalwindow")
        d.style.display = "none"
        d.close()
    }
</script>
<div id="modalwindow" class="position-fixed" style="top:40%;right:10px;z-index:2000;">
<div class="card border-0" style="width: 300px; background:none;">
  <div class="card-body p-0"><div style="float:right;cursor: pointer;background:#ccc;padding:0 5px 0 5px;color:#000;" value="Confirm" onclick="closeDialog()">Cerrar</div>
<iframe src="https://www.youtube.com/embed/CbsCoDAnmnk?si=V-kdQPSRVUpV6QAG" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
  </div>
</div>
</div>
 
satanson dijo:
Hola betas, estoy creando una pequeña ventana para colocar videos en position fixed, pero cuando cierro la ventana se sigue escuchando el audio. Alguien me puede decir como lo soluciono?. Mas abajo dejo las lineas de codigo.

HTML: 
<script type="text/javascript">
 function closeDialog() {
        let d = document.getElementById("modalwindow")
        d.style.display = "none"
        d.close()
    }
</script>
<div id="modalwindow" class="position-fixed" style="top:40%;right:10px;z-index:2000;">
<div class="card border-0" style="width: 300px; background:none;">
  <div class="card-body p-0"><div style="float:right;cursor: pointer;background:#ccc;padding:0 5px 0 5px;color:#000;" value="Confirm" onclick="closeDialog()">Cerrar</div>
<iframe src="https://www.youtube.com/embed/CbsCoDAnmnk?si=V-kdQPSRVUpV6QAG" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
  </div>
</div>
</div>
Hacer clic para expandir...
Eliminando la url en "src" del iframe.
 
Pon la URL en una variable, luego cuando abras la ventana cambias el Source del iframe por tu variable, luego cuando cierras dejas el Source en " "
Y si abren el modal de nuevo cargas lees la variable
 
moiseseccam dijo:
Pon la URL en una variable, luego cuando abras la ventana cambias el Source del iframe por tu variable, luego cuando cierras dejas el Source en " "
Y si abren el modal de nuevo cargas lees la variable
Hacer clic para expandir...
No puedo poner la url en una variable por no tengo ni idea xD, ademas el contenido los llamo con una veriable $settings['iframe']. como se podria eliminar todo el contenido de iframe? creo que seria una solucion pero no se como se hace.
 
YeltsinReyes dijo:
Eliminando la url en "src" del iframe.
Hacer clic para expandir...
Se que si, pero no se como. Pero no sabes como podria reemplazar todo el contenido de que halla en un <div></div> por que el contenido de dicho modal lo llama con una variable $settings['modal'].
 
OSTRAS!!!! acabo de ver esto en otra pagina y me funciono:
JavaScript: 
    <script type="text/javascript">
     function closeDialog() {
    const element = document.getElementById("modalwindow");
    element.remove();
        }
    </script>
 
satanson dijo:
No puedo poner la url en una variable por no tengo ni idea xD, ademas el contenido los llamo con una veriable $settings['iframe']. como se podria eliminar todo el contenido de iframe? creo que seria una solucion pero no se como se hace.
Hacer clic para expandir...

En el javascript puedes hacerlo, ponle un id al iframe y luego lo llamas con document.getElementById('id_del_elemento') y editas su propiedad src del iframe
 
satanson dijo:
Se que si, pero no se como. Pero no sabes como podria reemplazar todo el contenido de que halla en un <div></div> por que el contenido de dicho modal lo llama con una variable $settings['modal'].
Hacer clic para expandir...
Este elimina la url del src del iframe!

HTML: 
<script type="text/javascript">
function closeDialog(){

    let d = document.getElementById("modalwindow");
    d.style.display = "none";
    d.close();
   
    document.getElementById("modalwindowiframe").src = '';
   
}
</script>

<div id="modalwindow" class="position-fixed" style="top:40%;right:10px;z-index:2000;">
    <div class="card border-0" style="width: 300px; background:none;">
        <div class="card-body p-0">
       
            <div style="float:right;cursor: pointer;background:#ccc;padding:0 5px 0 5px;color:#000;" value="Confirm" onclick="closeDialog()">Cerrar</div>
           
            <iframe src="https://www.youtube.com/embed/CbsCoDAnmnk?si=V-kdQPSRVUpV6QAG" title="YouTube video player" frameborder="0"
            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
            referrerpolicy="strict-origin-when-cross-origin" allowfullscreen id="modalwindowiframe"></iframe>
           
        </div>
    </div>
</div>
 
moiseseccam dijo:
En el javascript puedes hacerlo, ponle un id al iframe y luego lo llamas con document.getElementById('id_del_elemento') y editas su propiedad src del iframe
Hacer clic para expandir...
YeltsinReyes dijo:
Este elimina la url del src del iframe!

HTML: 
<script type="text/javascript">
function closeDialog(){

    let d = document.getElementById("modalwindow");
    d.style.display = "none";
    d.close();
  
    document.getElementById("modalwindowiframe").src = '';
  
}
</script>

<div id="modalwindow" class="position-fixed" style="top:40%;right:10px;z-index:2000;">
    <div class="card border-0" style="width: 300px; background:none;">
        <div class="card-body p-0">
      
            <div style="float:right;cursor: pointer;background:#ccc;padding:0 5px 0 5px;color:#000;" value="Confirm" onclick="closeDialog()">Cerrar</div>
          
            <iframe src="https://www.youtube.com/embed/CbsCoDAnmnk?si=V-kdQPSRVUpV6QAG" title="YouTube video player" frameborder="0"
            allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
            referrerpolicy="strict-origin-when-cross-origin" allowfullscreen id="modalwindowiframe"></iframe>
          
        </div>
    </div>
</div>
Hacer clic para expandir...
Gracias!!!
 
Hay que estar conectado o registrado para responder aquí.
Atrás
Arriba