Cómo crear un spoiler que solo se cargue al hacer clic

  • Autor Autor Agustinn
  • Fecha de inicio Fecha de inicio
A

Agustinn

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Buenas, estoy intentado poner un spoiler pero que no se cargue hasta hacer click sobre el.
Aca les pongo el ejemplo que no me funciona:
<div class="divspoiler">

<input type="button" value="Opcion 2" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; this.value = 'Ocultar'; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none'; this.value = 'Opcion 2'; }" />
</div><div><div class="spoiler" style="display: none;">

<iframe id="ciframe" width="800" height="450" src="http://vaughnlive.tv/embed/video/beto_3?viewers=true&autoplay=false"></iframe>


</div></div></center>

lo que quiero hacer es que no cargue el iframe hasta que haga click en "opcion 2", porque sino aunque este oculto se escucha el sonido del iframe.
Desde ya les agradezco su ayuda!
 
HTML:
<div class="divspoiler">

<input type="button" value="Opcion 2" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; this.value = 'Ocultar'; document.getElementById('ciframe').src= 'http://vaughnlive.tv/embed/video/beto_3?viewers=true&autoplay=false'; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none'; this.value = 'Opcion 2'; document.getElementById('ciframe').src= 'about:blank'; }" />
</div><div><div class="spoiler" style="display: none;">

<iframe id="ciframe" width="800" height="450" src="about:blank"></iframe>


</div></div></center>

lo que se hace es cargar nada en el iframe, luego cuando le dan click cargar la url
 
Genio!, Muchas Gracias, funciono a la perfeccion! 🙂
 
Atrás
Arriba