一个网页翻译插件

当前脚本只是动态接入 https://github.com/xnx3/translate 项目翻功能
Wrap lines
// ==UserScript==
// @name         一个网页翻译插件
// @namespace    https://tools.0x5c0f.cc
// @version      1.2.0
// @description  当前脚本只是动态接入 https://github.com/xnx3/translate 项目翻功能
// @description  配置参考 https://translate.zvo.cn/index.html
// @description  当前脚本由 Cursor gpt-4o-mini模型 生成
// @author       0x5c0f
// @license      CC BY-NC-SA 4.0
// @match        *://*/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

    const container = document.createElement('div');
    container.style.position = 'fixed';
    container.style.left = '20px';
    container.style.top = '60px';
    container.style.backgroundColor = 'rgba(255, 255, 255, 0.9)';
    container.style.boxShadow = '0 0 10px rgba(0, 0, 0, 0.5)';
    container.style.borderRadius = '8px';
    container.style.padding = '10px';
    container.style.zIndex = '99999';
    container.style.width = 'auto';
    container.style.transition = 'all 0.3s ease';

    const titleDiv = document.createElement('div');
    titleDiv.innerText = '🤔';
    titleDiv.style.fontSize = '18px';
    titleDiv.style.fontWeight = 'bold';
    titleDiv.style.marginBottom = '10px';
    titleDiv.style.textAlign = 'center';
    titleDiv.style.cursor = 'move';
    container.appendChild(titleDiv);

    // 创建关闭按钮
    const closeButton = document.createElement('button');
    closeButton.innerText = '⊹'; // 使用 × 符号作为关闭按钮的文本
    closeButton.style.position = 'absolute';
    closeButton.style.right = '10px';
    closeButton.style.top = '10px';
    closeButton.style.backgroundColor = 'transparent';
    closeButton.style.border = 'none';
    closeButton.style.fontSize = '20px';
    closeButton.style.cursor = 'pointer';
    closeButton.title = '隐藏'; // 鼠标悬停时显示的提示

    // 添加关闭按钮的点击事件
    closeButton.addEventListener('click', function() {
        container.style.display = 'none'; // 隐藏主 div
    });

    // 将关闭按钮添加到标题 div 中
    titleDiv.appendChild(closeButton);

    // 创建翻译 div
    const translateDiv = document.createElement('div');
    translateDiv.id = 'translate';
    translateDiv.style.width = '100%';
    translateDiv.style.height = 'auto';
    translateDiv.style.border = '1px solid #ccc';
    translateDiv.style.padding = '5px';
    container.appendChild(translateDiv);

    document.body.appendChild(container);

    let isDragging = false;
    let offsetX, offsetY;

    titleDiv.addEventListener('mousedown', function(e) {
        e.preventDefault();
        isDragging = true;
        offsetX = e.clientX - container.getBoundingClientRect().left;
        offsetY = e.clientY - container.getBoundingClientRect().top;
        container.style.transition = 'none';
    });

    document.addEventListener('mousemove', function(e) {
        if (isDragging) {
            requestAnimationFrame(() => {
                container.style.left = (e.clientX - offsetX) + 'px';
                container.style.top = (e.clientY - offsetY) + 'px';
            });
        }
    });

    document.addEventListener('mouseup', function() {
        isDragging = false;
        container.style.transition = 'all 0.3s ease';
    });

    const script = document.createElement('script');
    script.src = 'https://res.zvo.cn/translate/translate.js';
    script.onload = function() {
        translate.language.setLocal("chinese_simplified");
        translate.service.use("client.edge");
        translate.selectLanguageTag.languages = "chinese_simplified,chinese_traditional,english,japanese";
        translate.execute();

        const selectElement = document.getElementById('translateSelectLanguage');
        if (selectElement) {
            const rect = selectElement.getBoundingClientRect();
            translateDiv.style.width = `${rect.width}px`; // 设置宽度以匹配选择框
            translateDiv.style.height = `${rect.height}px`; // 设置高度以匹配选择框
        }
    };
    document.head.appendChild(script);
})();
欢迎访问Greasy Fork镜像
