☰

一键隐藏图片

摸鱼时页面显示与工作不相关的图片未免有些明目张胆，这时候就需要一键隐藏全图了。

  1. // ==UserScript==
  2. // @name            一键隐藏图片
  3. // @namespace       https://github.com/sdokio
  4. // @version         0.3.3
  5. // @author          SoyaDokio
  6. // @description     摸鱼时页面显示与工作不相关的图片未免有些明目张胆，这时候就需要一键隐藏全图了。
  7. // @homepage        https://github.com/sdokio/UserScript
  8. // @icon            data:image/jpg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gIoSUNDX1BST0ZJTEUAAQEAAAIYAAAAAAQwAABtbnRyUkdCIFhZWiAAAAAAAAAAAAAAAABhY3NwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAA9tYAAQAAAADTLQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlkZXNjAAAA8AAAAHRyWFlaAAABZAAAABRnWFlaAAABeAAAABRiWFlaAAABjAAAABRyVFJDAAABoAAAAChnVFJDAAABoAAAAChiVFJDAAABoAAAACh3dHB0AAAByAAAABRjcHJ0AAAB3AAAADxtbHVjAAAAAAAAAAEAAAAMZW5VUwAAAFgAAAAcAHMAUgBHAEIAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFhZWiAAAAAAAABvogAAOPUAAAOQWFlaIAAAAAAAAGKZAAC3hQAAGNpYWVogAAAAAAAAJKAAAA+EAAC2z3BhcmEAAAAAAAQAAAACZmYAAPKnAAANWQAAE9AAAApbAAAAAAAAAABYWVogAAAAAAAA9tYAAQAAAADTLW1sdWMAAAAAAAAAAQAAAAxlblVTAAAAIAAAABwARwBvAG8AZwBsAGUAIABJAG4AYwAuACAAMgAwADEANv/bAEMACAYGBwYFCAcHBwkJCAoMFQ4MCwsMGRITDxUeGyAfHhsdHSElMCkhIy0kHR0qOSotMTM2NjYgKDs/OjQ+MDU2M//bAEMBCQkJDAsMGA4OGDMiHSIzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzMzM//AABEIABAAEAMBIgACEQEDEQH/xAAXAAADAQAAAAAAAAAAAAAAAAAABAUG/8QAIxAAAgICAgEEAwAAAAAAAAAAAQIDBAURITEGEhMiQRVhcf/EABUBAQEAAAAAAAAAAAAAAAAAAAME/8QAHBEBAAEEAwAAAAAAAAAAAAAAAQACESExcZHh/9oADAMBAAIRAxEAPwDe5rOXLmYEMk9nH4ZZjX9+sR63fj5NtTpNhgNHsHf6drZH8HlKdZcw2Uo2pBCTIys0LkEjTKPkDrRB62D98lzGLRyEqZDGz5DGzTGWKSLZauTyysoIJXeyCAeyP7Pw/jT2fIjNDVkq4avMs0QsKRI7qrKAo3sINg7I2eufotcy8RM2KQ79n//Z
  9. // @icon64          https://cdn.jsdelivr.net/gh/sdokio/UserScript/assets/images/hide_pictures_on_page_64x64.jpg
  10. // @supportURL      https://github.com/sdokio/UserScript/issues/new/choose
  11. // @license         MIT
  12.  
  13. // @match           *://*/*
  14. // @require         https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.slim.min.js
  15. // @run-at          document-start
  16.  
  17. // @grant           GM_addStyle
  18. // @grant           GM_getValue
  19. // @grant           GM_setValue
  20.  
  21. // @note            2022/01/24 0.3.3 新功能：记忆特定网站习惯（如在www.baidu.com隐藏了图片，关闭浏览器下次再进入仍是默认隐藏。如需再次显示需要自行设置为显示）
  22. // @note            2021/01/29 0.3.2 添加logo
  23. // @note            2021/01/29 0.3.1 新功能：拖拽控制面板；控制面板位置记忆
  24. // @note            2021/01/27 0.2.1 修复复选框点击无效问题；添加动图使用说明
  25. // @note            2021/01/26 0.1   初版发布
  26. // ==/UserScript==
  27.  
  28. (function () {
  29.     "use strict";
  30.  
  31.     Array.prototype.indexOf = function (val) {
  32.         for (var i = 0; i < this.length; i++) if (this[i] == val) return i;
  33.         return -1;
  34.     }
  35.     Array.prototype.remove = function (val) {
  36.         while (true) {
  37.             var index = this.indexOf(val);
  38.             if (index > -1) {
  39.                 this.splice(index, 1);
  40.             } else {
  41.                 break;
  42.             }
  43.         }
  44.     }
  45.  
  46.     var hpop_config_custom;
  47.     var hpop_config_default = {
  48.         "version": "0.3.3",
  49.         "sitesHide": [],
  50.         "position": {
  51.             "top": window.innerHeight / 2 - 14 + "",
  52.             "left": "0",
  53.             "right": "auto"
  54.         }
  55.     }
  56.  
  57.     const STYLE_RAW = "" +
  58.         ".hpop-panel{" +
  59.         "position:fixed;" +
  60.         "width:64px;" +
  61.         "height:20px;" +
  62.         "font-size:12px;" +
  63.         "font-weight: 500;" +
  64.         "font-family:Verdana, Arial, '宋体';" +
  65.         "background:#f1f1f1;" +
  66.         "z-index:2147483647;" +
  67.         "margin: 0;" +
  68.         "opacity:0.4;" +
  69.         "transition:0.3s;" +
  70.         "overflow:hidden;" +
  71.         "user-select:none;" +
  72.         "text-align:left;" +
  73.         "white-space:nowrap;" +
  74.         "line-height:20px;" +
  75.         "padding:3px 6px;" +
  76.         "border:1px solid #ccc;" +
  77.         "box-sizing: content-box;" +
  78.         "}" +
  79.         ".hpop-panel-left{" +
  80.         "transform:translate(-63px,0);" +
  81.         "border-width:1px 1px 1px 0;" +
  82.         "border-top-right-radius: 14px;" +
  83.         "border-bottom-right-radius: 14px;" +
  84.         "}" +
  85.         ".hpop-panel-right{" +
  86.         "transform:translate(63px,0);" +
  87.         "border-width:1px 0 1px 1px;" +
  88.         "border-top-left-radius: 14px;" +
  89.         "border-bottom-left-radius: 14px;" +
  90.         "padding-left: 10px;" +
  91.         "padding-right: 0;" +
  92.         "}" +
  93.         ".hpop-panel input{" +
  94.         "margin: 0;" +
  95.         "padding: 0;" +
  96.         "vertical-align:middle;" +
  97.         "-webkit-appearance:checkbox;" +
  98.         "-moz-appearance:checkbox;" +
  99.         "position: static;" +
  100.         "clip: auto;" +
  101.         "opacity: 1;" +
  102.         "cursor: pointer;" +
  103.         "}" +
  104.         ".hpop-panel.hpop-panel-active{" +
  105.         "width:70px;" +
  106.         "opacity: 0.9;" +
  107.         "}" +
  108.         ".hpop-panel.hpop-panel-left-active{" +
  109.         "left: 0px;" +
  110.         "transform:translate(0,0);" +
  111.         "}" +
  112.         ".hpop-panel.hpop-panel-right-active{" +
  113.         "right: 0px;" +
  114.         "transform:translate(0,0);" +
  115.         "}" +
  116.         ".hpop-panel label{" +
  117.         "margin:0;" +
  118.         "padding:0 0 0 3px;" +
  119.         "font-weight:500;" +
  120.         "}" +
  121.         ".hpop-panel-move{" +
  122.         "border-width:1px 1px 1px 0;" +
  123.         "border-radius: 14px;" +
  124.         "}" +
  125.         " ";
  126.  
  127.     main();
  128.  
  129.     function main() {
  130.         // 取出本地缓存配置
  131.         hpop_config_custom = GM_getValue("hpop_config");
  132.         if (!hpop_config_custom) {
  133.             hpop_config_custom = hpop_config_default;
  134.         }
  135.         // 将数据结构的变更保存到本地缓存配置
  136.         var updFlag = false;
  137.         for (var _key in hpop_config_default) {
  138.             if (!hpop_config_custom.hasOwnProperty(_key)) {
  139.                 hpop_config_custom._key = hpop_config_default._key;
  140.                 updFlag = true;
  141.             }
  142.         }
  143.         if (updFlag) {
  144.             // 保存当前配置到本地缓存
  145.             GM_setValue("hpop_config", hpop_config_custom);
  146.         }
  147.  
  148.         generateControlPanel();
  149.     }
  150.  
  151.     // 生成控制面板（浮动元素）
  152.     function generateControlPanel() {
  153.         // 新建控制面板元素
  154.         var node = document.createElement("hide-pictures-on-page");
  155.         node.id = "hpop-panel";
  156.         if (hpop_config_custom.position.left == 0) {
  157.             node.className = "hpop-panel hpop-panel-left";
  158.         }
  159.         if (hpop_config_custom.position.right == 0) {
  160.             node.className = "hpop-panel hpop-panel-right";
  161.         }
  162.         node.style.cssText = "position:fixed;top:" + hpop_config_custom.position.top + "px;"
  163.             + "left:" + hpop_config_custom.position.left + "px;"
  164.             + "right:" + hpop_config_custom.position.right + "px;";
  165.         node.innerHTML = "<input type='checkbox' id='hpop-switch' />"
  166.             + "<label style='cursor:pointer;font-size:12px;color:3d3d3d;'>隐藏图片</label>";
  167.         // 仅在顶层窗口添加控制面板
  168.         if (window.self === window.top) {
  169.             if (document.querySelector("body")) {
  170.                 document.body.appendChild(node);
  171.             } else {
  172.                 document.documentElement.appendChild(node);
  173.             }
  174.         }
  175.         // 根据记忆状态（显示/隐藏）初始化该网站
  176.         if (hpop_config_custom.sitesHide.indexOf(document.location.hostname) > -1) {
  177.             document.querySelector("#hpop-switch").checked = true;
  178.             $(document).ready(function() {
  179.                 $("img").hide();
  180.             });
  181.         }
  182.         // 添加控制面板所需样式
  183.         var _style = document.createElement("style");
  184.         _style.type = "text/css";
  185.         _style.innerHTML = STYLE_RAW;
  186.         if (document.querySelector("#hpop-panel")) {
  187.             document.querySelector("#hpop-panel").appendChild(_style);
  188.         } else {
  189.             GM_addStyle(STYLE_RAW);
  190.         }
  191.         // 给控制面板添加鼠标滑入/滑出时展开/吸附效果
  192.         node.addEventListener("mouseover", function () {
  193.             node.classList.add("hpop-panel-active");
  194.             if (hpop_config_custom.position.left == 0) {
  195.                 node.classList.add("hpop-panel-left-active");
  196.             }
  197.             if (hpop_config_custom.position.right == 0) {
  198.                 node.classList.add("hpop-panel-right-active");
  199.             }
  200.         });
  201.         node.addEventListener("mouseleave", function () {
  202.             setTimeout(function () {
  203.                 node.classList.remove("hpop-panel-active");
  204.                 node.classList.remove("hpop-panel-left-active");
  205.                 node.classList.remove("hpop-panel-right-active");
  206.             }, 300);
  207.         });
  208.         // 给控制面板添加拖拽效果
  209.         node.addEventListener("mousedown", function (event) {
  210.             node.style.transition = "null";
  211.             var dispX = event.clientX - node.offsetLeft;
  212.             var dispY = event.clientY - node.offsetTop;
  213.  
  214.             var move = function (event) {
  215.                 node.classList.add("hpop-panel-move");
  216.                 node.style.left = event.clientX - dispX + "px";
  217.                 node.style.top = event.clientY - dispY + "px";
  218.             }
  219.  
  220.             document.addEventListener("mousemove", move);
  221.             document.addEventListener("mouseup", function () {
  222.                 node.classList.remove("hpop-panel-move");
  223.  
  224.                 node.style.transition = "0.3s";
  225.                 document.removeEventListener("mousemove", move);
  226.                 var bodyWidth = document.body.clientWidth;
  227.                 var hpop_nodeWidth = node.offsetLeft + node.offsetWidth / 2;
  228.                 if (hpop_nodeWidth > bodyWidth / 2) {
  229.                     node.style.left = "auto";
  230.                     node.style.right = 0;
  231.                     node.classList.remove("hpop-panel-left");
  232.                     node.classList.add("hpop-panel-right");
  233.                     hpop_config_custom.position.left = "auto";
  234.                     hpop_config_custom.position.right = "0";
  235.                 } else {
  236.                     node.style.left = hpop_config_custom.position.left = 0;
  237.                     node.style.right = hpop_config_custom.position.right = "auto";
  238.                     node.classList.add("hpop-panel-left");
  239.                     node.classList.remove("hpop-panel-right");
  240.                 }
  241.                 hpop_config_custom.position.top = node.offsetTop;
  242.                 // 保存当前配置到本地缓存
  243.                 GM_setValue("hpop_config", hpop_config_custom);
  244.             });
  245.         });
  246.         // 给控制面板添加点击显示/隐藏效果
  247.         var toggleShowHide = function () {
  248.             if (document.querySelector("#hpop-switch").checked) {
  249.                 document.querySelector("#hpop-switch").checked = false;
  250.                 $("img").show("500");
  251.                 // 取消记忆本网站下次默认隐藏图片
  252.                 hpop_config_custom.sitesHide.remove(document.location.hostname);
  253.             } else {
  254.                 document.querySelector("#hpop-switch").checked = true;
  255.                 $("img").hide("500");
  256.                 // 记忆本网站下次默认隐藏图片
  257.                 hpop_config_custom.sitesHide.push(document.location.hostname);
  258.             }
  259.             // 保存当前配置到本地缓存
  260.             GM_setValue("hpop_config", hpop_config_custom);
  261.         }
  262.         node.addEventListener("click", toggleShowHide);
  263.         node.querySelector("#hpop-switch").addEventListener("click", toggleShowHide);
  264.     }
  265. })();

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址