Задержка загрузки iframe?

Я знаю, что есть некоторые инструменты и методы для задержки загрузки javascript, но у меня есть iframe, который я хотел бы отложить загрузку до тех пор, пока остальная часть страницы не закончит загрузку и рендеринг (iframe находится в скрытом, который не будет обнаружен, пока кто-то не нажмет на определенную вкладку на странице. Есть ли способ отложить загрузку iframe? Любые предложения будут высоко оценены. Спасибо!

9
delay iframe javascript

8 ответов

С jquery это легко!

либо заключите свой код, который загружает iframe в $() или использовать $(document).ready(function(){}) они оба одинаковы и будут выполнять ваш код после того, как DOM будет готов!

например

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

на http://www.learningjquery.com/2006/09/introducing-document-ready

7

Не знаю, нужно ли запускать без javascript. Но лучший метод-изменить src сразу после 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>

использование $(document).ready начнет рендеринг вашего Iframe сразу после сборки дерева DOM, но до загрузки всего содержимого на вашей стороне, поэтому я думаю, что это не то, что вы хотите.

в jQuery есть событие .load, который совпадает с onload (после загрузки всех ресурсов)

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

используйте Javascript в событии onLoad или в обработчике нажатия кнопки, чтобы установить атрибут src iframe.

4

вы также можете применить display: none к iframe с CSS, а затем использовать jQuery .показать так:

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

это работает для меня, но есть проблемы при изменении кода:

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

использование:

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

вы можете использовать атрибут отсрочки, когда нужно загрузить последний раз после css, js и т. д.:

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

или мое любимое использование

setTimeout('your app', 6000)

Это заставит его ждать x миллисекунд для вызова любой функции....

0

загрузить iFrame после загрузки страницы С в jQuery и немного html и 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>
0