// ==UserScript== // @name 上下翻页按钮 // @version 1.4 // @description 添加浮动按钮以进行上下翻页。 // @author DeepSeek // @match *://*/* // @run-at document-end // @grant none // @namespace https://greasyfork.org/users/452911 // @downloadURL none // ==/UserScript== (function() { 'use strict'; // 通用样式:移除点击时的蓝色高亮 const noTapHighlightStyle = ` -webkit-tap-highlight-color: transparent; outline: none; user-select: none; `; // 创建 SVG 上箭头图标(黑色) const upSvg = ` `; // 创建 SVG 下箭头图标(黑色) const downSvg = ` `; // 创建上翻按钮 const upButton = document.createElement('div'); upButton.innerHTML = upSvg; upButton.style.cssText = ` position: fixed; right: 10px; top: 40%; width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.7); border-radius: 5px; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 9999; transition: opacity 0.2s; ${noTapHighlightStyle} `; // 创建下翻按钮 const downButton = document.createElement('div'); downButton.innerHTML = downSvg; downButton.style.cssText = ` position: fixed; right: 10px; top: calc(40% + 80px); width: 40px; height: 40px; background-color: rgba(255, 255, 255, 0.7); border-radius: 5px; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 9999; transition: opacity 0.2s; ${noTapHighlightStyle} `; // 悬停效果 upButton.addEventListener('mouseenter', () => upButton.style.opacity = '0.8'); upButton.addEventListener('mouseleave', () => upButton.style.opacity = '1'); downButton.addEventListener('mouseenter', () => downButton.style.opacity = '0.8'); downButton.addEventListener('mouseleave', () => downButton.style.opacity = '1'); // 滚动事件 upButton.addEventListener('click', () => { window.scrollBy(0, -window.innerHeight * 0.8); }); downButton.addEventListener('click', () => { window.scrollBy(0, window.innerHeight * 0.8); }); // 将按钮添加到文档中 document.body.appendChild(upButton); document.body.appendChild(downButton); })();