How to also change the flag of the selected language?

Asked

Viewed 235 times

0

On the link 1: How to customize google-Translate on my website? I managed to customize dropdown language using the google-Translate, now I would like to customize my selection as follows, when selected a language I would like the flag of the selected language to be displayed as the selected one.

Today when selecting any language the standard flag continues that of Brazil, because I have not found a suitable solution to solve this.

Flag Br continua como default

javascript css

  • That icon you made?

  • In fact it was the design of the team and the other tbm...

  • have to post the code snippet?

1 answer

0

I got it solved guys, 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');
    }
}

Browser other questions tagged javascript css

You are not signed in. Login or sign up in order to post.