图片全局模糊

一个用于给网站图片添加模糊效果的油猴脚本

  1. // ==UserScript==
  2. // @name 图片全局模糊
  3. // @namespace https://gf.qytechs.cn/zh-CN/users/1361855-fourth-master
  4. // @version 1.0.1
  5. // @description 一个用于给网站图片添加模糊效果的油猴脚本
  6. // @author Fourth_Master
  7. // @match *://*/*
  8. // @require https://lf3-cdn-tos.bytecdntp.com/cdn/expire-1-M/arrive/2.4.1/arrive.min.js
  9. // @require https://gf.qytechs.cn/scripts/403716-gm-config-cn/code/GM_config_CN.js
  10. // @grant GM_info
  11. // @grant GM_getValue
  12. // @grant GM_setValue
  13. // @grant GM_registerMenuCommand
  14. // @grant GM_addStyle
  15. // @run-at document-start
  16. // @noframes
  17. // @license GNU General Public License v3.0 or later
  18. // @namespace https://gf.qytechs.cn/scripts/531690
  19. // @supportURL https://gf.qytechs.cn/scripts/531690
  20. // @homepageURL https://gf.qytechs.cn/scripts/531690
  21. // ==/UserScript==
  22.  
  23. (function() {
  24. 'use strict';
  25.  
  26. // 获取更新时间
  27. function getUpdateTime(timestamp) {
  28. return timestamp ? (' (更新于: ' + new Date(timestamp).toLocaleDateString() + ')') : '';
  29. }
  30.  
  31. const style = {
  32. // 设置面板样式
  33. settings: `
  34. #myGoodBoyConfig {
  35. --primary: #4A90E2;
  36. --text: #333;
  37. --bg: #FFF;
  38. --border: #E0E0E0;
  39. font-family: system-ui, sans-serif;
  40. line-height: 1.6;
  41. }
  42.  
  43. #myGoodBoyConfig .section_header {
  44. padding: 1rem;
  45. background: var(--primary);
  46. border-radius: 0.4rem;
  47. }
  48.  
  49. #myGoodBoyConfig input[type="checkbox"] {
  50. width: 1.2em;
  51. height: 1.2em;
  52. }
  53.  
  54. #myGoodBoyConfig button {
  55. padding: 0.6em 1.2em;
  56. border-radius: 0.4em;
  57. transition: opacity 0.2s;
  58. }
  59.  
  60. #myGoodBoyConfig button:hover {
  61. opacity: 0.9;
  62. }
  63. `,
  64. };
  65.  
  66. // 初始化配置
  67. GM_config.init({
  68. 'id': 'myGoodBoyConfig',
  69. 'title': GM_config.create('a', {
  70. 'textContent': '图片全局模糊-设置 ver.' + GM_info.script.version,
  71. 'title': '点击跳转到脚本页面' + getUpdateTime(GM_info.script.lastModified),
  72. 'target': '_blank',
  73. 'href': 'https://sleazyfork.org/zh-CN/scripts/531690',
  74. }),
  75. 'skin': 'tab',
  76. 'css': style.settings,
  77. 'frameStyle': {
  78. 'width': '400px',
  79. 'height': '350px',
  80. },
  81. 'fields': {
  82. 'blurEnable': {
  83. 'section': GM_config.create('a', {
  84. textContent: '作者: Fourth_Master',
  85. title: '点击反馈问题',
  86. target: '_blank',
  87. href: 'https://blog.soeg.cn/',
  88. }),
  89. 'label': '启用图片模糊效果',
  90. 'type': 'checkbox',
  91. 'default': false
  92. },
  93. 'blurRadius': {
  94. 'label': '模糊半径',
  95. 'type': 'int',
  96. 'min': 1,
  97. 'max': 20,
  98. 'default': 10
  99. }
  100. }
  101. });
  102.  
  103. // 添加模糊效果
  104. function applyBlurEffect() {
  105. if (!GM_config.get('blurEnable')) return;
  106.  
  107. const blurRadius = GM_config.get('blurRadius');
  108. const style = `
  109. img {
  110. filter: blur(${blurRadius}px);
  111. transition: filter 0.3s;
  112. }
  113. img:hover {
  114. filter: blur(0);
  115. }
  116. `;
  117.  
  118. GM_addStyle(style);
  119. }
  120.  
  121. // 注册(不可用)菜单命令
  122. GM_registerMenuCommand('图片全局模糊 - 设置', () => GM_config.open());
  123.  
  124. // 初始化
  125. applyBlurEffect();
  126. })();

QingJ © 2025

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