如何禁用谷歌翻译原始文本工具提示答案

【问题标题】：How to disable google translate original text tooltips如何禁用谷歌翻译原始文本工具提示
【发布时间】：2011-03-15 04:15:00
【问题描述】：

我在我的网站中使用了谷歌翻译作为语言转换器，但它显示了令人讨厌的工具提示，称为“原始文本”。如何禁用此功能以及任何其他更好的想法/工具/api来执行此操作？

谢谢。使用的代码是……

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

【问题讨论】：

标签： javascript jquery html internationalization google-translate

【解决方案1】：

只需将此 CSS 添加到 CSS 文件的顶部即可：

.goog-tooltip {
    display: none !important;
}
.goog-tooltip:hover {
    display: none !important;
}
.goog-text-highlight {
    background-color: transparent !important;
    border: none !important; 
    box-shadow: none !important;
}

我浪费了 8 个小时来解决这个问题，但现在在这 3 行 CSS 之后，它看起来很棒 :-) 你可以在这里看到它的实际效果：SEOgenie - Automated SEO

【讨论】：

它在这里使用得当，你想强制行为。 css-tricks.com/when-using-important-is-the-right-choice

【解决方案2】：

您可以采取一些措施来“覆盖”您网站上显示的 Google 翻译器。

我一直在使用休耕

隐藏建议框（!important 部分非常重要:)）

#goog-gt-tt, .goog-te-balloon-frame{display: none !important;} 
.goog-text-highlight { background: none !important; box-shadow: none !important;}

隐藏电源

.goog-logo-link{display: none !important;}
.goog-te-gadget{height: 28px !important;  overflow: hidden;}

移除顶部框架

body{ top: 0 !important;}
.goog-te-banner-frame{display: none !important;}

还有更多，但我想以上内容会带你走上正确的道路；）

大家好。

【讨论】：

【解决方案3】：

#google_translate_element {
  display:none;
}

CSS display:none 可能会起作用。

【讨论】：

这是为了隐藏 Google 注入到您页面中的 UI。如果有人想避免注入 UI（而是依赖自定义的东西或横幅 iframe），请不要在调用他们的脚本 include 之前嵌入 div。
这隐藏了整个翻译元素。

【解决方案4】：

我觉得我的方法更好^^

    $(document).ready(function() 
    {       
        translationTooltipsDisable();
    });


    function translationTooltipsDisable()
    {       
        //Override google's functions
        _tipon = function()  { /*Don't display the tooltip*/ };
        _tipoff = function() { /*Don't hide the tooltip*/ };
    }

【讨论】：

【解决方案5】：

看来你可以在他们用来做“工具提示”的 iframe 上使用一些 CSS 来隐藏它。

.goog-te-balloon-frame { display: none; }

当他们更新服务并更改名称/结构时，它可能是一个移动的目标，但它现在可以在我正在进行的网站上运行。

更新：我注意到鼠标悬停/悬停背景颜色效果似乎在此方法中持续存在，但它似乎是通过 JavaScript 完成的（添加为元素本身的样式属性，而不是您可以的类切换更容易覆盖它）。使用 Google 的翻译 JavaScript 来做很多事情已经证明是相当困难的。无论如何，摆脱 iframe 是最重要的部分。

【讨论】：