Event which triggers when stylesheets, not only the DOM, are loaded on the page

Question

I tried to use the http://api.jquery.com/ready/ callback for executing a code, which I would like to get started only when the page is fully loaded. However, this triggers when the DOM is loaded, and it can often happen that the stylesheets are not loaded fully.

How can I ensure that a particular code is loaded after DOM and also the stylesheets (or even everything) are loaded? I found some similar questions (like this one ), but they are not about stylesheet loading, which I am particularly interested in.

Thanks for suggestions.

Answer 1

If you really don't mind waiting for everything (including images, etc) to load, then you can use the standard load event:

$(window).load(function() {
    // your code here
});

Answer 2

I first thought of RequireJS but it appears they have specific reasons why it wouldn't work well. http://requirejs.org/docs/faq-advanced.html#css

They do offer a possible hack "Some people have implemented an approach where they look for a well known style to be applied to a specific HTML element to know if a style sheet is loaded."