小窗口看网页

摸鱼用，显示按钮在网页左下角，修改网页网址在油猴菜单里

// ==UserScript==
// @name         小窗口看网页
// @namespace    http://tampermonkey.net/
// @version      2024.07.01.2
// @description  摸鱼用，显示按钮在网页左下角，修改网页网址在油猴菜单里
// @author       You
// @grant        GM_registerMenuCommand
// @grant        GM_getValue
// @grant        GM_setValue
// @match        *://*/*
// @icon         https://www.google.com/s2/favicons?sz=64&domain=doc88.com
// @license MIT
// ==/UserScript==

(function() {
    'use strict';
    if(window.self !== window.top){
        return;
    }
    let ifSrc = GM_getValue("ifSrc", "https://cn.bing.com/");
    let ifW = GM_getValue("ifW", 20);
    let ifH = GM_getValue("ifH", 40);
    let ifOpen = 0;

    // 创建一个新的iframe元素
    let iframe = document.createElement('iframe');

    // 设置iframe的src属性，这里假设你要嵌入的页面地址是http://example.com
    iframe.src = ifSrc;

    var style_all = document.createElement('style');
    var css_all;

    style_all.type = 'text/css';
    document.head.appendChild(style_all);

    // 定义CSS样式，并添加!important以提高优先级

    function changeStyle(){
        css_all = `
  .custom-small-iframe {
    display: none !important;
    position: fixed !important;
    bottom: 5% !important;
    left: 10px !important;
    width: ${ifW}% !important;
    height: ${ifH}% !important;
    border: none !important;
    z-index: 9999999999 !important;
  }
.custom-remove-button {
    opacity: 0.1 !important;
    position: fixed !important;
    bottom: 1% !important;
    left: 10px !important;
    width: 4% !important;
    height: 4% !important;
    z-index: 9999999999 !important;
}`;
        style_all.innerHTML = css_all;
    }
    changeStyle();

    iframe.className = "custom-small-iframe";

    // 防止跨域错误
    iframe.sandbox = 'allow-scripts allow-same-origin';
    document.body.appendChild(iframe);

    try{
        let iframeContent = iframe.contentWindow.document;

        let style_ifhtml = iframeContent.createElement('style');
        style_ifhtml.type = 'text/css';

        // 设置CSS规则，使内部HTML宽度为100%
        style_ifhtml.innerHTML = 'body, html { width: 100% !important; margin: 0; padding: 0; }';

        // 将<style>元素插入到iframe的<head>中
        iframeContent.head.appendChild(style_ifhtml);
    }catch (error){
        console.log(error);
    }
    // 创建删除按钮
    let removeButton = document.createElement('button');
    removeButton.textContent = '显示';

    removeButton.className = "custom-remove-button";

    // 为删除按钮添加点击事件监听器
    removeButton.addEventListener('click', function() {
        ifOpen = ifOpen ? 0 : 1;
        if(ifOpen){// 将iframe添加到页面中
            iframe.style.cssText += 'display:block!important;';
            removeButton.textContent = '隐藏';
        }else{
            iframe.style.cssText += 'display:none!important;';
            removeButton.textContent = '显示';
        }
    });

    // 将删除按钮添加到页面中
    document.body.appendChild(removeButton);

    GM_registerMenuCommand('修改src', function() {
        ifSrc = window.prompt("修改src",iframe.src);
        if(ifSrc === null) return;
        GM_setValue("ifSrc",ifSrc);
        iframe.src = ifSrc;
    });
    GM_registerMenuCommand('修改宽高', function() {
        let input = window.prompt("修改 宽,高",ifW + "," + ifH);
        if(input === null) return;
        input = input.split(",");
        ifW = input[0];
        ifH = input[1]
        GM_setValue("ifW",ifW);
        GM_setValue("ifH",ifH);
        changeStyle();
        // location.reload();
    });
    // Your code here...
})();