Google整页翻译一直运行

谷歌浏览器整页翻译(原位翻译,不跳转页面),去除顶部翻译栏,适配移动端布局。在所有网页(除百度和优酷外)左下角均会显示翻译按钮。

// ==UserScript==
// @name         Google整页翻译一直运行
// @author       anonymous
// @license      GPL-3.0-only
// @match        http://*/*
// @include      https://*/*
// @include      file://*/*
// @exclude      /.*baidu.*/
// @exclude      /youku\.com/

// @run-at       document-end
// @noframes
// @description  谷歌浏览器整页翻译(原位翻译,不跳转页面),去除顶部翻译栏,适配移动端布局。在所有网页(除百度和优酷外)左下角均会显示翻译按钮。

// @note         去除顶部翻译栏,添加显示原文按钮;修改翻译按钮为在页面边缘附着的半透明圆角按钮,鼠标移入弹出翻译或显示原文按钮。
// @note         优化移动端布局,去除翻译时图片的请求,加快翻译速度。(除发现重大BUG外,后期将不再更新。)
// @note         只是把长度单位字符(em)改成了像素(px),防止出现按钮尺寸显示不正常的现象。
// @note         屏蔽百度和优酷网址。
// @version      0.16
// @namespace   https://greasyfork.org/users/574851
// ==/UserScript==

(function () {
    'use strict';
       function addNewElement(innerhtml,node,src) {
        var element = document.createElement(node);
        if(src){
            element.src = innerhtml;
        }else{
            element.innerHTML = innerhtml;
        }
        document.getElementsByTagName('head')[0].appendChild(element);
    }

    // 隐藏顶部栏
        const head = document.head
        const style = document.createElement('style')
        const text = [
      //翻译按钮样式设置
           '#google_translate_element {',
         '  position: fixed;',
         '  width: 80px;',//按钮宽度(仅PC端生效)
         '  left: 0px;',//左侧边距离设置;如果要靠右设置,left改成right即可
         '  bottom: 25px;',//距离底部高度
         '  height: 22px;',//按钮高度
         '  border: 2px solid #0000;',//边框线设置
         '  border-radius: 5px;',//边界半径设置
         '  z-index: 10000000;',
         '  overflow: hidden;',
         '  box-shadow: 1px 1px 3px 0 #0000;',//外边框阴影设置
         '  opacity: 0.4;',//初始透明度设置
         '  transform: translateX(-75%);',//按钮隐藏百分比设置(仅PC端生效)
         '  transition: all 0.3s;',
         '}',
           '#google_translate_element:hover {',
         '  opacity: 1;',//透明度设置
         '  transform: translateX(0);',
         '}',
         '#google_translate_element .goog-te-gadget-simple {',
         '  width: 100%;',
         '}',
         '.goog-te-banner-frame.skiptranslate {',
         '  display: none',
         '}',
         'html,body{',
         '  top: 0!important',
         '}',
     //原文按钮样式设置
        '.recoverPage {',
        '  width: 45px;',//按钮宽度(仅PC端生效)
        '  background-color: #F0F8FF;',//背景色设置
        '  position: fixed;',
        '  left: -5px;',//左侧边距离设置;如果要靠右设置,left改成right即可
        '  z-index: 10000000;',
        '  bottom: 50px;',//距离底部高度
        '  user-select: none;',
        '  text-align: center;',
        '  border: 1px solid #a8a8a8;',//边框线设置
        '  font-size: small;',
        '  line-height: 25px;',//按钮高度设置(仅PC端生效)
        '  border-radius: 15px;',//边界半径设置
        '  box-shadow: 1px 1px 3px 0 #C0C0C0;',//外边框阴影设置
        '  opacity: 0.4;',//初始透明度设置
        '  transform: translateX(-70%);',//按钮隐藏百分比设置(仅PC端生效)
        '  transition: all 0.3s;',
        '  }',
        '.recoverPage:hover {',
        '  opacity: 1;',//透明度设置
        '  transform: translateX(0);',
        '  }',
        '.recoverPage:active {',
        '  box-shadow: 1px 1px 3px 0 #888 inset;',
        '  }',

/*----移动端UI适配设置(PC端不生效)-----------------------------------------*/
        ' @media handheld, only screen and (max-width: 768px) {',
     //翻译按钮样式设置
        ' #google_translate_element {',
        '  width: 104px;',//按钮宽度
        '  }',
        '  #google_translate_element .goog-te-combo {',
        '  margin: 0;',
        '  padding-top: 2px;',
        '  border: none;',
        '  }',
     //原文按钮样式设置
        ' .recoverPage {',
        '  width: 34px;',//按钮宽度
        '  line-height: 24px;',//按钮高度设置
        '  transform: translateX(-40%);',//按钮隐藏百分比设置
        '  transform: translateX(1);',//隐藏功能开关,0为关闭;1为打开
        '  }',
        '  }',
          ].join('\n')
          const style_text = document.createTextNode(text)
          style.appendChild(style_text)
          head.appendChild(style)

   // 恢复原网页按钮设置
      const initScript = document.createElement('script')
      const initText = document.createTextNode([
        // 清除图片的请求,加快访问速度
          "  img = [].slice.call(document.querySelectorAll('#goog-gt-tt img,#google_translate_element img'));",
          "  img.forEach(function(v, i){",
          "   v.src = '';",
          "  });",

          "  const recoverPage = document.createElement('div')",
          "  recoverPage.setAttribute('class', 'notranslate recoverPage')",
          "  recoverPage.innerText = '原文'",
          "  document.body.appendChild(recoverPage)",
          "  recoverPage.onclick = (() => {",
          "  const phoneRecoverIframe = document.getElementById(':1.container')",
          "  const PCRecoverIframe = document.getElementById(':2.container')",
          "    if (phoneRecoverIframe) {",
          "      const recoverDocument = phoneRecoverIframe.contentWindow.document",
          "      recoverDocument.getElementById(':1.restore').click()",
          " } else if (PCRecoverIframe) {",
          "      const recoverDocument = PCRecoverIframe.contentWindow.document",
          "      recoverDocument.getElementById(':2.restore').click()",
          "    }",
          "  })",
        ].join("\n"))
        initScript.appendChild(initText)
        head.appendChild(initScript)

   //翻译按钮设置
      var google_translate_element = document.createElement('div');
        google_translate_element.id = 'google_translate_element';
        document.documentElement.appendChild(google_translate_element);

        var gtehtml="function googleTranslateElementInit() {" +
            "new google.translate.TranslateElement({" +
            "autoDisplay: true,"+
            "layout: google.translate.TranslateElement.InlineLayout.SIMPLE," +
            "multilanguagePage: true," +
            "pageLanguage: 'auto'," +
            "includedLanguages: 'zh-CN,zh-TW,en,ja,ru'" +
            "}, 'google_translate_element');}";


        addNewElement(gtehtml,'script',false);
        addNewElement('https://cdn.jsdelivr.net/gh/zs6/gugefanyijs@1.9/element.js','script',true);

}());