ccc

Mostrando entradas con la etiqueta iframe. Mostrar todas las entradas
Mostrando entradas con la etiqueta iframe. Mostrar todas las entradas

Cargar dinámicamente un vídeo en un iframe cuando se haya cargado toda la página

<iframe width="100%" height="340px" src="" data-src="https://www.youtube.com/embed/9bNinvQIETc" frameborder="0" allowfullscreen></iframe>
...
$(function() {
$("iframe").each(function() {
if ($(this).attr("src") == "") {
console.log($(this).attr("data-src"));
dataSRC = $(this).attr("data-src");
$(this).attr("src", dataSRC);
}
});
});

iframe: extraer la url que carga el iframe

// antes de nada deben cambiarse las comillas simples por dobles
$row["video"] = str_replace("'", "\"", $row["video"]);
preg_match('/src="([^"]+)"/', $row["video"], $match);
$video = $match[1];

Especial agradecimiento a Carlos Sierra García

iframe: Redimensionar el height del iframe dependiendo del alto de la página que ha cargado

<script>
  function resizeIframe(obj) {
    obj.style.height = 0; // muy importante iniciarlizarlo a 0
    obj.style.height = obj.contentWindow.document.body.scrollHeight + 'px';
  }
</script>

<iframe src="..." frameborder="0" scrolling="no" onload="resizeIframe(this)">

iframe: Operaciones

// Acceder desde el padre a una variable del iframe
document.getElementById("frameCarga").contentWindow.miVariable

// Acceder desde la página del iframe a un div o variable del padre
var parentObject = parent.document.getElementById("zonaRetornoCSS3");
parentObject.value = "123";

// Desde el iframe cambiar la propiedad CSS de un elemento del padre
$('#iframeCSS3generator', window.parent.document).attr('src','');

// Enlazar desde la ventana dentro del iframe con la ventana padre
<a target="_parent" href="xxx">Cargar en página principal</a><br>
// Mostrar una capa que se encuentra en el padre del iframe
$('#micapa', window.parent.document).show();
Acceder desde el contenido del iframe al padre con JQuery:
$('#micapa', window.parent.document).html();