Sophia Sophia - 1 year ago 56
Javascript Question

jQuery Append CSS File and Wait until styles are applied without setInterval?

I load CSS by:

$('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />');

It works, but I have a function that needs to run after the CSS has been applied, and I don't want use
for it.

How can I do this ?

Answer Source

One solution, if you've got access to the css file you're loading,
is to use the transitionend event, and to activate a transition, with duration set to 0.1, from your css.

Like so, you are sure the CSS has been calculated.




    body{transition : opacity 0.1s linear; opacity:.9};
    document.body.addEventListener('transitionend', function(){
       }, false);
    $('head').append('<link rel="stylesheet" href="style2.css" type="text/css" />');