谷歌浏览器整页翻译（原位翻译，不跳转页面），去除顶部翻译栏，适配移动端布局。在所有网页（除百度和优酷外）左下角均会显示翻译按钮。
当前为
// ==UserScript==
// @name Google整页翻译一直运行-自改
// @author anonymous
// @author zyb
// @license GPL-3.0-only
// @match http://*/*
// @include https://*/*
// @include file://*/*
// @exclude /.*baidu.*/
// @exclude /youku\.com/
// @exclude /.bilibili.*/*
// @exclude /.*ngarihealth.*/
// @exclude /.*qq.*/
// @run-at document-end
// @noframes
// @description 谷歌浏览器整页翻译（原位翻译，不跳转页面），去除顶部翻译栏，适配移动端布局。在所有网页（除百度和优酷外）左下角均会显示翻译按钮。
// @note 去除顶部翻译栏，添加显示原文按钮；修改翻译按钮为在页面边缘附着的半透明圆角按钮，鼠标移入弹出翻译或显示原文按钮。
// @note 优化移动端布局，去除翻译时图片的请求，加快翻译速度。（除发现重大BUG外，后期将不再更新。）
// @note 只是把长度单位字符（em）改成了像素（px），防止出现按钮尺寸显示不正常的现象。
// @note 屏蔽百度和优酷网址等国内常用网址。
// @version 0.12
// @namespace https://greasyfork.org/users/574851
// ==/UserScript==
(function () {
'use strict';
let addNewElement = function(innerhtml,node,src) {
let 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;',
//' max-width: 120px;',//按钮宽度(仅PC端生效)
' min-width: 90px;',//按钮宽度(仅PC端生效)
' height: 25px;',//按钮高度
' left: 0;',//左侧边距离设置；如果要靠右设置，left改成right即可
' bottom: 20px;',//距离底部高度
' border: 2px solid #4990e4;',//边框线设置
' border-radius: 0 13px 13px 0;',//边界半径设置
' z-index: 10000000;',
' overflow: hidden;',
' box-shadow: 1px 1px 3px 0 #0000;',//外边框阴影设置
//' opacity: 0.4;',//初始透明度设置
' transform: translateX(-75%);',//按钮隐藏百分比设置(仅PC端生效)
' transition: all 0.3s;',
' background-color: #ffffff;',
'}',
'#google_translate_element:hover {',
' opacity: 1;',//透明度设置
' transform: translateX(0);',
'}',
'#google_translate_element .goog-te-gadget-simple {',
' width: 100%;',
' padding-top: 2px',
'}',
'#google_translate_element .goog-te-gadget-simple .goog-te-gadget-icon{',
' display: inline-block;',
'}',
'.goog-te-banner-frame.skiptranslate {',
' display: none',
'}',
'html,body{',
' top: 0!important',
'}',
//通用按钮样式
'.btnBox {',
' width: 45px;',//按钮宽度(仅PC端生效)
' background-color: #F0F8FF;',//背景色设置
' position: fixed;',
' left: 0;',//左侧边距离设置；如果要靠右设置，left改成right即可
' z-index: 10000000;',
' user-select: none;',
' text-align: center;',
' border: 2px solid #4990e4;',//边框线设置
' font-size: small;',
' line-height: 25px;',//按钮高度设置(仅PC端生效)
' border-radius: 0 15px 15px 0;',//边界半径设置
' box-shadow: 1px 1px 3px 0 #C0C0C0;',//外边框阴影设置
// ' opacity: 0.4;',//初始透明度设置
' transform: translateX(-50%);',//按钮隐藏百分比设置(仅PC端生效)
' transition: all 0.3s;',
' cursor: pointer',
' }',
//原文按钮样式设置
'.recoverPage {',
' bottom: 50px;',//距离底部高度
' }',
'.recoverPage:hover {',
' opacity: 1;',//透明度设置
' transform: translateX(0);',
' }',
'.recoverPage:active {',
' box-shadow: 1px 1px 3px 0 #888 inset;',
' }',
//翻译按钮样式设置
'.translateBtn {',
' bottom: 85px;',//距离底部高度
' }',
'.translateBtn:hover {',
' opacity: 1;',//透明度设置
' transform: translateX(0);',
' }',
'.translateBtn:active {',
' box-shadow: 1px 1px 3px 0 #888 inset;',
' }',
//隐藏翻译按钮
'.hidetranslate {',
' display: none;',
' }',
/*----移动端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;',
' }',
//原文按钮样式设置
' .btnBox {',
' 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 btnBox 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)
//翻译按钮设置
const translateBtn = document.createElement('div');
translateBtn.setAttribute('class', 'notranslate btnBox translateBtn');
translateBtn.innerText = '翻译';
document.body.appendChild(translateBtn);
translateBtn.onclick = (() => {
translateBtn.setAttribute('class', 'notranslate btnBox translateBtn hidetranslate');
//翻译语种按钮设置
let google_translate_element = document.createElement('div');
google_translate_element.id = 'google_translate_element';
document.documentElement.appendChild(google_translate_element);
let 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/[email protected]/element.js','script',true);
})
//addNewElement(gtehtml,'script',false);
//addNewElement('https://cdn.jsdelivr.net/gh/zs6/[email protected]/element.js','script',true);
}());