Retarder le chargement de l'iframe?

Question

Je sais qu'il existe des outils et des techniques pour retarder la charge de javascript, mais j'ai un iframe que je voudrais retarder le chargement jusqu'à ce que le reste de la page ait fini le téléchargement et le rendu (l'iframe est caché Ne pas être révélé jusqu'à ce que quelqu'un clique sur un onglet particulier sur la page.Il ya un moyen de retarder la charge d'un iframe? Toutes les suggestions seraient très appréciées.Merci!

Answer 1

avec jquery il est facile!

soit joindre votre code qui charge le i cadre dans un $() ou utiliser $(document).ready(function(){}) ces deux sont les mêmes et exécuterait votre code après que le DOM est prêt!

par exemple.

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

voir plus à http://www.learningjquery.com/2006/09/introducing-document-ready

Answer 2

Utilisez Javascript dans l'événement onLoad, ou dans le bouton cliquez sur gestionnaire, pour définir l'attribut src de l'iframe.

Answer 3

Ou mon utilisation préférée

setTimeout('your app', 6000) 

Cela va faire attendre x nombre de millisecondes pour appeler toutes les fonctions ....

Answer 4

ne sais pas si besoin de faire fonctionner sans javascript. Mais le meilleur est Methode do changer le src directement après l'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> 

Utiliser $ (document) .ready Commencera le rendu de votre Iframe directement après l'arbre DOM est construit, mais avant tout le contenu en votre côté est chargé, donc je pense que ce n'est pas ce que vous voulez.

jquery a l'événement .load, qui est le même que onload (après toutes les ressources sont chargées) Vous pouvez également appliquer l'affichage

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

Answer 5

: aucun à l'iframe avec CSS, utilisez le .show jQuery comme celui-ci :

$(document).ready(function(){ 
    $('iframe.class_goes_here').show(); 
}); 

Answer 6

Cela fonctionne pour moi, mais il a des problèmes si vous modifiez le code du tout:

function loadIFrame() { 
    window.frames['BodyFrame'].document.location.href = "iframe.html"; 
}   
function delayedLoad() { 
    window.setTimeout(loadIFrame2, 5000); 
} 

Utilisation de:

<iframe src="" onLoad="delayedLoad()"></iframe> 

Answer 7

Vous pouvez utiliser l'attribut defer en cas de besoin charger dernière après css, js etc:

iframe defer src="//player.vimeo.com/video/89455262" 

Answer 8

iFrame de charge après page chargée Avec JQuery et un peu html et js

// Javascript 
 
$(window).bind("load", function() { 
 
    $('#dna_video').prepend('<iframe src="//player.vimeo.com/video/86554151" width="680" height="383" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>'); 
 
});

<!-- Append JQuery--> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<!-- HTML --> 
 
<div id="dna_video"></div>