2014-10-02 5 views
0

Я хочу скрыть iframes во время загрузки, чтобы предотвратить белый прямоугольник над цветом фона.Скрыть iframe во время загрузки

Моих фактические JS

$('#my_frame') 
    .css('visibility', 'hidden') 
    .attr('src', '/my_new_page.html') 
    .one('load', function() { 
     $(this).css('visibility', 'visible') 
    }); 

Проблема заключается в том, когда в iframe я ловлю onbeforeunload события и предотвратить переключатель страницы, из-за iframe никогда не сгореть load события, так что остается скрытыми.

Как я могу это сделать?

PS: Я попытался поймать событие unload, прежде чем скрыть страницу, но он не срабатывает при смене src.

jsFiddle demo

+0

«.one» это для того, чтобы поймать событие только один раз ;-) –

+0

Ваш код работает http://jsfiddle.net/tbptgzhm/ :) –

+0

@BojanPetkovski - он не работает, если я предотвращаю изменение страницы улавливая событие 'onbeforeunload' внутри iframe –

ответ

1

После нескольких попыток я нашел метод работы:

$frame 
    .load(function() { 
    this.style.visibility = 'visible'; 
    this.contentWindow.onunload = function (e) { 
     this.window.frameElement.style.visibility = 'hidden'; 
    }; 
    }); 

когда Iframe нагрузки я показываю его, и я придаю это окно событие выгрузку, скрывающую IFRAME.

+0

Спасибо большое. Ты действительно сделал мой день –

0

не указан в CSS от фрейма для отображения: ни один, а затем сделать $ (документ) .ready() и изменить CSS для отображения блока внутри него. должен держать его скрытым до тех пор, пока DOM не загрузится, а затем отобразит его.

+0

эта функция прикреплена к кнопке , поэтому, когда я нажимаю на него, iframe будет скрыт, изменит атрибут src и при загрузке снова отобразит его. Проблема в том, что когда я изменяю 'src', и я препятствую изменению формы страницы внутри iframe, она остается скрытой. –

Смежные вопросы