frequent
frequent

Reputation: 28523

jquery - can I detect once all content is loaded?

I have a page with a lot of ads being loaded in piece by piece.

I need to position an element relative to overall page height, which is changing during load, because of ads being added.

Question: Is there a jquery event or similar to detect, when all elements are loaded? I'm currently "waiting" with setTimeout, but this is far from nice.

An idle event would be nice, which fires once after pageload if no new http requests are made for xyz secs.

Upvotes: 4

Views: 7309

Answers (4)

Harsh Bhatia
Harsh Bhatia

Reputation: 139

$( window ).load(function() {
  //loading bar here /gif imagel
  loader(); 
  //will call at the end of window load
});

function Loader(){
  //Your main function here complete webpage
};

Upvotes: 0

simplyharsh
simplyharsh

Reputation: 36383

Ideally the answer would be $(function(){ }) or window.onload = function(){} that fires after all the DOM contents are loaded. But I guess, the ads on your page starts loading asynchronously after the DOM load.

So, assuming you know the number of 'ads' on your page (you said you are loading them piece by piece), my advise would be to increment a counter on each successful 'ad' load. When that counter reaches the total number of ads, you fire a 'all_adv_loaded' function.

Upvotes: 0

Nathan
Nathan

Reputation: 11159

There's no idle function, but there is

$(window).load(function () {
    ...
});

Upvotes: 0

Sarfraz
Sarfraz

Reputation: 382881

You can use onload event which triggers when ALL elements eg DOM, images, frames and external resources have loaded into the page.

Vanilla JavaScript:

window.onload = function(){ ......... }

jQuery:

$(window).load(function() {.........});

Upvotes: 7

Related Questions