Execute jQuery code after all CSS rules have been applied

Question

$(document).ready() executes the code when all HTML elements have been loaded.

How to execute jQuery code after all of the CSS rules have been applied?

I have few stylesheets linked to the page and it takes some time to load the page. Element layout changes during the time of the loading.

For usability purposes I need to correct the element layout after all of them have target sizes. Otherwise I get wrong sizes of those elements.

Now I do it on focus or after some timeout, but need this after the page loads.

$(document).ready() This line means the jQuery should only start executing once your entire page is loaded. There may be an issue with the CSS. — Matt Asbury
– Matt Asbury, Commented Dec 14, 2010 at 16:22
window.load should do , it will till all the images loads also — kobe
– kobe, Commented Dec 14, 2010 at 16:23

Emmett · Accepted Answer · 2010-12-14 16:21:29Z

11

$(window).load() fires after the whole page (images, CSS, etc.) has loaded.

answered Dec 14, 2010 at 16:21

Emmett

14.4k12 gold badges58 silver badges82 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

takeshin Over a year ago

Thanks, I was playing with $(document).load(), but I just needed $(window).load()

Kragalon Over a year ago

@Emmett How would I get this to work if I am dynamically injecting CSS? thanks

kobe · Accepted Answer · 2010-12-14 16:25:29Z

2

$(window).load(function() {

 // executes when complete page is fully loaded, including all frames, objects and images

 alert("window is loaded");

});

answered Dec 14, 2010 at 16:25

kobe

15.9k15 gold badges67 silver badges93 bronze badges

Collectives™ on Stack Overflow

Execute jQuery code after all CSS rules have been applied

2 Answers 2

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related