Search code examples
webtranslate

Google Translate Drop Down

i have purchased a website template and i need help concerning the website translator using google translate. The translate works well but after selecting a language, a google drop down appears and when i scroll down, it still appears and hides my main header titles. Can something be done like removing this drop down when i translate a language or can someone suggest me another method. Thanks a lot. The Drop down highlighted in red

Solution

  • The problem is the the contents in this bar are inside of an iframe, So you cant use javascript to trigger the close button.

    Solution

    Once the user chooses a language the an iframe with a class named 'goog-te-banner-frame' is added.

    You can use javascript to detect if it present and hide it

    $(document).ready(function(){
if($('.goog-te-banner-frame').length > 0){//check if the iframe exsits
            $('.goog-te-banner-frame').css('display','none');
            $('body').css('top',0);//google adds top to the body so the bar wont cover website content
    }
});

    because this code uses jquery. make you sure you load it like this:

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>