如何使用 HTML CSS 禁用弹出的谷歌翻译答案

【问题标题】：How To Disable Pop Up Google Translation With HTML CSS如何使用 HTML CSS 禁用弹出的谷歌翻译
【发布时间】：2016-08-07 06:10:00
【问题描述】：

我在我的网站中使用 Google Widget 进行翻译。但是当我点击翻译时，它会在我的页面顶部弹出并在向下滚动时劝阻我的菜单导航。

我尝试了一些 css、html 和 javascript，但无法修复点击时如何隐藏我的菜单导航中弹出的谷歌翻译？

CSS：

#google_translate_element{width:300px;float:right;text-align:right;display:block}
#goog-gt-tt {dispaly:none;visibility: hidden;}

HTML 和 JavaScript：

<div class="google_translate_element" id="google_translate_element"></div><div 
id="goog-gt-tt" 
class="goog-tooltip skiptranslate"  ></div><script type="text/javascript">
function googleTranslateElementInit() {
  new google.translate.TranslateElement({pageLanguage: 'id', includedLanguages: 'af,ar,de,en,eo,es,et,fa,fr,id,it,ja,jv,ka,kn,la,mn,ms,ne,nl,pa,ru,so,sr,su,ta,th,tl,tr,uk,vi,zh-CN,zh-TW', layout: google.translate.TranslateElement.InlineLayout.SIMPLE, autoDisplay: false}, 'google_translate_element');
}
</script><script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>

感谢回答

【问题讨论】：

你可以尝试添加#goog-gt-tt {dispaly:none !important;可见性：隐藏！重要；}
@Nick 谢谢，但它确实修复了
@Nick_O 谢谢。我注意到弹出窗口的 ID 已更改为 #gtx-trans

标签： javascript html css popup language-translation

【解决方案1】：

最后我通过查看 Inspect Element 找到了它。把这些都隐藏起来

#google_translate_element{width:300px;float:right;text-align:right;display:block}
.goog-te-banner-frame.skiptranslate { display: none !important;} 
body { top: 0px !important; }
#goog-gt-tt{display: none !important; top: 0px !important; } 
.goog-tooltip skiptranslate{display: none !important; top: 0px !important; } 
.activity-root { display: hide !important;} 
.status-message { display: hide !important;}
.started-activity-container { display: hide !important;}

【讨论】：

【解决方案2】：

使用以下 URL，将您要翻译的网站的 . 更改为 -，并使用您希望的语言代码（例如：en 表示英语）：

https://url_here.translate.goog/?_x_tr_sl=from_lang&_x_tr_tl=to_lang

例如，如果您想将网站stackoverflow.com 从英语翻译成加泰罗尼亚语，您可以使用以下 URL：

https://stackoverflow-com.translate.goog/?_x_tr_sl=en&_x_tr_tl=ca

【讨论】：