Google Translate Widget - Traduzione di callback completa

Question

Sto utilizzando la traduce il widget di su uno dei miei siti con il seguente google forniti di codice:

<div id="google_translate_element"></div><script type="text/javascript"> 
function googleTranslateElementInit() { 
    new google.translate.TranslateElement({pageLanguage: 'en', layout: google.translate.TranslateElement.InlineLayout.SIMPLE}, 'google_translate_element'); 
} 
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script> 

<script> 

Il mio problema: Il traduce corre dopo che la pagina è stata caricata, ma io ha anche uno script che dimensiona automaticamente i miei elementi di navigazione principali in base alla loro larghezza.

Viene eseguito prima del termine della conversione, quindi viene ridimensionato in base alle etichette inglesi non tradotte. Una volta che il traduttore ha modificato il testo di navigazione, gli elementi di navigazione devono essere ridimensionati per adattarsi alle parole appena tradotte poichè potrebbero essere di dimensioni diverse (larghezza) rispetto all'inglese.

Ho provato a chiamare il codice di traduzione di Google prima di eseguire il codice per ridimensionare la navigazione principale, ma il traduttore viene eseguito in modo asincrono, quindi il mio codice viene eseguito prima che il traduttore sia completo.

C'è un evento di richiamata generato quando la traduzione è completa (o un modo per rilevare quando la traduzione è completa), quindi posso aspettare prima che tenti di ridimensionare la navigazione?

Inoltre, ho bisogno di eseguire uno script DOPO che la pagina ha finito di tradurre.

Answer 1

Ecco la correzione ho finito per usare:

jQuery(function(){ 
    firstMenu = $("#nav li:first").text(); 

    setTimeout(waitNav, 500); 
}); 

function waitNav() { 

    if (firstMenu != $('#nav li:first').text()) { 

     initNav(); 
     firstMenu = $('#nav li:first').text(); 
     setTimeout(waitNav, 500); 

    } 
    else { 
     setTimeout(waitNav, 500); 
    } 

} 

In sostanza, mantenere il controllo se un pezzo noto di testo è cambiato (in questo caso è la prima voce nel blocco di navigazione).

Se è stato modificato significa che il traduttore è stato eseguito, eseguire il codice che è necessario eseguire dopo la traduzione (initNav() qui).

Continuo a controllare le modifiche nel caso in cui l'utente selezioni un'altra lingua.

Non è perfetto, ma funziona per me :-)

Answer 2

È possibile rilevare i cambiamenti in questo modo:

$('#some-translatable-element').bind('DOMSubtreeModified', function() { 
    yourCallback(); 
}); 

Lo svantaggio è che l'evento è beeing sparato più volte da google traduttore fa multipla cambiamenti nel processo.

Un suggerimento è quello di rilevare le modifiche sull'ultimo elemento della pagina, perché poi sai che tutti gli elementi sopra sono tradotti.