Saltar al contenido

¿Retrasar la carga de iframe?

Solución:

¡con jquery es fácil!

o adjunte su código que carga el iframe dentro de un $()
o usar $(document).ready(function(){})
¡Ambos son iguales y ejecutarían su código después de que el DOM esté listo!

p.ej

$(document).ready(function(){
    $('iframe#iframe_id').attr('src', 'iframe_url');    
});

ver más en http://www.learningjquery.com/2006/09/introducing-document-ready

No sé si es necesario ejecutarlo sin javascript. Pero el mejor método es cambiar el src directamente después del iframe:

<iframe id="myIframe" src="http://.." />
<script type="text/javascript">
  var iframe = document.getElementById('myIframe').src = iframe.src;
  iframe.src="";
  document.onload =  function(){iframe.src = src;}
</script>

El uso de $ (document) .ready iniciará la representación de su Iframe directamente después de que se compile el árbol DOM, pero antes de que se cargue todo el contenido de su lado, así que creo que esto no es lo que desea.

jquery tiene el evento .load, que es lo mismo que onload (después de que se cargan todos los recursos)

$(window).load(function(){  iframe.src = src; }

No entiendo por qué todos confunden JAVASCRIPT con JQUERY, pero …

La solución JS pura se encuentra a continuación: (básicamente, espera a que se compile el DOM y luego carga todos los iframes en su página).

<iframe src="" data-src="YOUR ACTUAL iFRAME URL">
<script type="text/javascript">
      function load_iframes() {
var vidDefer = document.getElementsByTagName('iframe');
for (var i=0; i<vidDefer.length; i++) {
if(vidDefer[i].getAttribute('data-src')) {
vidDefer[i].setAttribute('src',vidDefer[i].getAttribute('data-src'));
} } }
      document.addEventListener("DOMContentLoaded", function(event) {
         load_iframes();
      });
    </script>

Nota: Tenga cuidado con el uso del evento document.load. Cualquier recurso que tenga un problema o tenga que pasar 1 minuto para cargar detendrá la ejecución de su código. Este fragmento de código se modifica (se reemplaza load por domcontentloaded) de esta referencia.

¡Haz clic para puntuar esta entrada!
(Votos: 0 Promedio: 0)



Utiliza Nuestro Buscador

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *