In the 1 link: # I was able to customize dropdown of languages using the < google-translate , now I would like to customize my selection as follows, when I select a language I would like the flag of the selected language to be displayed as the one selected.
Today when I select any language the default flag continues to be in Brazil, as I have not found a suitable solution to solve this.
I was able to resolve personnel, follow the js with the solution:
// Javascript QUE IRÁ MUDAR O IDIOMA //
var comboGoogleTradutor = null; //Varialvel global
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'pt',
includedLanguages: 'de,fr,en,es,pt',
layout: google.translate.TranslateElement.InlineLayout.HORIZONTAL
}, 'google_translate_element');
comboGoogleTradutor = document.getElementById("google_translate_element").querySelector(".goog-te-combo");
}
function changeEvent(el) {
if (el.fireEvent) {
el.fireEvent('onchange');
} else {
var evObj = document.createEvent("HTMLEvents");
evObj.initEvent("change", false, true);
el.dispatchEvent(evObj);
}
}
/* FUNÇÃO QUE PASSA A SIGLA QUE SERVE DE PONTEIRO PARA TRADUÇÃO E
QUE PASSA A IMAGEM CORRENTE PARA O DROPDOWN */
function trocarIdioma(sigla) {
console.log(sigla)
$('#current-flag').attr('src', '/images/flags/'+sigla+'.svg')
if (comboGoogleTradutor) {
comboGoogleTradutor.value = sigla;
changeEvent(comboGoogleTradutor);//Dispara a troca
console.log('changeEvent');
}
}