Execute jQuery once document is ready AND iframe content is loaded

Question

As you can see on this page http://musicglaze.com/chase-status-let-you-go-feat-mali-feed-me-remix/#comments
comment section is way out of place, After research I understood that it is caused because plugin responsible for styling (http://masonry.desandro.com/) is called within

$(document).ready(function(){

});

function. however, content is loaded into iframe after that, therefore changing its height, but as plugin takes into account its original height without content everything gets messed up. Is there something I can use which would behave similar to this pseudocode?

Document ready AND iframe content loaded {

//My jQuery code

}

Try this if you have access to both the pages jquery-iframe-load-event http://stackoverflow.com/questions/5788499/jquery-iframe-load-event — Mohit Padalia, Apr 27 '13 at 15:20
Sorry for the off topic but it is a nice looking site http://musicglaze.com — A. Wolff, Apr 27 '13 at 15:32

score 20 · Answer 1 · answered Jan 23 '14 at 22:47

Use $('#iframeId').load(function() { ... }); instead of onReady. The underlying issue is that there are cross-domain security risks to allowing the parent frame access to an iframe's content, so onReady is not available, but onLoad is still accessible. For more details, see: http://www.nczonline.net/blog/2009/09/15/iframes-onload-and-documentdomain/

score 2 · Accepted Answer · answered Apr 27 '13 at 15:20

2

same ready() function

$(document).ready(function() {
    $('#frameId').ready(function() {
    ...
    });
})

answered Apr 27 '13 at 15:20

monkeyinsight

4,024
1
16
26

1

Hi, didn't seem to fix the issue, Only difference I made to your code was to use all iframes instead one with specific id `$('iframe').ready(function() {` Still, comments section is outof position – Ilja Apr 27 '13 at 16:28
Indeed this does not seem to work. The `.load` answer however works great - that should be the accepted one now. – beercohol Mar 06 '17 at 16:09

Execute jQuery once document is ready AND iframe content is loaded

2 Answers2

Linked