总安装量
11
今日新增
+4
用户评分
- / 5.0 (0)
当前版本
1.1
描述
版本1
评分0
权限说明
这是一个用于漫画/图片网站的智能自动滚动脚本,主要目的是触发网页的懒加载机制,让所有图片自动加载出来,方便一次性阅读。好的,我来全面介绍这个脚本的完整功能。
🎯 脚本功能介绍
📌 一句话概括
漫画图片网站智能自动滚动器 — 自动滚动页面触发懒加载图片,控制面板自动隐藏为边缘竖线,支持多种调节和快捷键。
🎛️ 功能全景图
┌─────────────────────────────────────────────────────┐
│ 功能体系 │
├─────────────┬─────────────┬────────────┬────────────┤
│ 滚动控制 │ 懒加载触发 │ 面板交互 │ 快捷操作 │
├─────────────┼─────────────┼────────────┼────────────┤
│ ▶ 自动滚动 │ 🔍 智能检测 │ 🫥 自动隐藏│ ⌨ 空格暂停 │
│ ⏸ 暂停继续 │ ⏳ 延迟等待 │ 📏 竖线指示│ ⬆ 回到顶部 │
│ ⚙ 速度调节 │ 🔄 假底识别 │ 🖱 边缘唤出│ ⬇ 直达底部 │
│ 📐 距离调节 │ 🔁 循环回顶 │ 💾 设置记忆│ 🅰 自动开关 │
└─────────────┴─────────────┴────────────┴────────────┘
一、🎮 核心功能
1. 智能自动滚动
| 功能 | 说明 |
|---|---|
| 自动开始 | 页面加载后自动开始滚动(可关闭) |
| 暂停/继续 | 点击按钮或按空格键切换 |
| 速度调节 | 50ms ~ 5000ms 范围,默认 300ms |
| 距离调节 | 100px ~ 2000px 范围,默认 600px |
| 平滑滚动 | 使用 smooth 行为,视觉流畅 |
2. 懒加载智能触发
这是脚本最独特的功能:
普通滚动:一直滚到底就停了 ❌
↓
智能滚动:滚到底部 → 等待500ms → 检测高度变化
↓
┌─ 高度增加 → 懒加载成功,继续滚 ✅
└─ 高度不变 → 真到底了,回顶部重来 ✅
解决的问题:
- 漫画网站通常用懒加载,一次性滚动太快会跳过未加载的图片
- 脚本会"等一等"让图片加载出来,然后再继续
3. 循环模式
到达真正底部后,自动回到顶部重新开始,适合:
- 需要反复浏览
- 等待新内容动态加载
- 测试页面完整加载情况
二、🖥️ 控制面板
面板布局
┌────────────────────┐
│ ⏸ 暂停 (绿色) │ ← 主控按钮,点击切换
│ ▶ 继续 (红色) │ 状态自动变色
├────────────────────┤
│ ⏱ 间隔: [300] ms │ ← 数字输入框
│ 📏 距离: [600] px │ ← 数字输入框
├────────────────────┤
│ ⬆ 回到顶部 │ ← 快捷跳转按钮
│ ⬇ 直达底部 │
├────────────────────┤
│ 🚀 自动开始 [开] │ ← 切换开关
│ 🫥 自动隐藏 [开] │
├────────────────────┤
│ "滚动中... (12次)" │ ← 实时状态显示
└────────────────────┘
面板自动隐藏
- 2秒后自动滑出屏幕,变成一条绿色竖线
- 竖线带脉冲发光动画,不显眼但可发现
- 触发唤出的方式:
- 🖱 鼠标悬停竖线
- 🖱 鼠标靠近屏幕左边缘 30px
- 🖱 点击竖线区域
- 唤出后面板平滑滑入,操作完离开后半秒自动隐藏
三、⌨️ 键盘快捷键
| 快捷键 | 功能 | 使用场景 |
|---|---|---|
空格 |
暂停/继续滚动 | 看到想看的画面立刻暂停 |
Ctrl + ↑ |
回到顶部 | 快速返回开头 |
Ctrl + ↓ |
直达底部 | 一次性触发所有懒加载 |
Ctrl + Shift + H |
切换自动隐藏 | 想固定面板时关闭隐藏 |
Ctrl + Shift + A |
切换自动开始 | 不想自动滚动时关闭 |
⚠️ 在输入框中不会触发快捷键,避免打字冲突
四、💾 设置记忆
- 自动开始偏好保存在浏览器
localStorage中 - 下次打开同一网站自动应用上次设置
- 即使清除缓存也不会丢失(除非清除站点数据)
五、🎨 视觉效果
| 元素 | 效果 |
|---|---|
| 面板背景 | 暗色半透明 + 毛玻璃模糊 |
| 暂停按钮 | 绿色(运行)/ 红色(暂停) |
| 隐藏竖线 | 4px 宽绿色渐变 + 脉冲光晕 |
| 按钮悬停 | 右移 2px 微动效 |
| 面板动画 | cubic-bezier 缓动曲线 |
| 滚动动画 | CSS smooth 平滑过渡 |
六、🛡️ 健壮性设计
| 措施 | 目的 |
|---|---|
| 页面卸载清理定时器 | 防止内存泄漏 |
Math.max 多值高度计算 |
兼容各种网页结构 |
localStorage try-catch |
存储失败不影响功能 |
| 输入框聚焦禁用快捷键 | 避免操作冲突 |
DOMContentLoaded 等待 |
确保 DOM 就绪 |
响应式 @media 查询 |
小屏幕自适应 |
📊 典型使用流程
1. 打开漫画网站
↓
2. 脚本自动开始滚动(如开启自动开始)
↓
3. 画面自动向下,图片逐个加载
↓
4. 看到想细看的画面 → 按空格暂停
↓
5. 看完 → 按空格继续
↓
6. 到达底部 → 自动回顶循环
↓
7. 面板2秒后自动隐藏为竖线
↓
8. 需要调设置 → 鼠标靠左唤出面板