jQuery Accoda file CSS e aspetta fino a carico?

Question

Sto cercando di aggiungere un file CSS utilizzando

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

che funziona grande - tuttavia, ho alcune funzioni che vengono eseguite dopo l'aggiunta del css e non riesco a trovare un modo per questi di attendi fino al termine del caricamento di questo file?

Come posso fare questo?

Answer 1

Proprio controllare quando è stata applicata una delle regole del nuovo CSS:

$('head').append('<link rel="stylesheet" href="http://cdn.sstatic.net/stackoverflow/all.css?v=d4a5c7ca0d4c" type="text/css" />'); 

var fakeListener = setInterval(function(){ 
    if($("body").css("text-align")=== "center"){ 
     clearInterval(fakeListener) 
     // What you want to do after it loads 
    } 
},50) 

(Questo è un esempio di lavoro)

Answer 2

La prima cosa da fare è mettere le funzioni all'interno del metodo ready, che eseguirà quelle funzioni dopo che il DOM è stato caricato.

<script type="text/javascript"> 
    jQuery(document).ready(function() { 
    // Your functions come here 
}); 
</script> 

Quindi basta inserire lo script davanti allo </body>. In questo modo l'append verrà attivata proprio quando la dom si carica.

<script type="text/javascript"> 
$('head').append(); 
</script> 

Un'altra aproach è quello di utilizzare l'evento di carico:
controllare questo link con l'esempio di lavoro, all'interno di esso ho impostato il corpo con uno sfondo verde, carica il foglio di stile StackOverflow che, quando termina il caricamento cambia il corpo al bianco.
http://jsfiddle.net/CQbqA/1/