背景
我看github的项目，其中README.md带图片点击打开查看图片，就会跳到对应的图片地址。如下：
就会跳到对应的图片地址，我很不爽！！！
演示
所以就有这个插件： 点开查看看，甚至可以打开github Web IDE。如下：
下载地址
下面全部是AI生成的
🎨 图标设计
简约设计融合GitHub与图片预览概念：
- GitHub蓝色背景 - 体现GitHub生态
- 标准GitHub图标 - 上半部分，清晰的品牌识别
- 图片预览框 - 下半部分，核心功能表现
- 山峰图标 - 代表图片内容
- 太阳元素 - 增加视觉层次感
✨ 功能特性
- 🔍 智能检测: 自动识别所有.md文件中的图片（包括README、文档、Wiki等）
- 🖱️ 一键预览: 点击图片或预览按钮即可打开弹窗
- 🔍 图片缩放: 支持1-10倍缩放，滚轮缩放，按钮控制
- 🖐️ 拖拽移动: 放大后可拖拽移动图片，智能边界限制
- 📥 图片下载: 一键下载当前预览的图片到本地（支持多种下载方式）
- 💻 快速IDE: 在GitHub页面添加"Open IDE"按钮，一键跳转到github.dev在线编辑器
- 📱 响应式设计: 支持桌面和移动设备
- ⌨️ 键盘导航: 支持方向键和ESC键操作
- 🌙 深色模式: 自动适配GitHub的深色主题
- 💻 多平台支持: 兼容GitHub.com和GitHub.dev编辑器
🚀 安装方法
方法一：Edge插件商店（chrome 开发者认证要$5， 我给不起）
- 访问 [Edge Web Store](#Edge Web Store "#")
- 点击"添加到Chrome"
- 确认安装
方法二：开发者模式安装
- 下载Releases 最新版本，解压文件夹
- 打开Chrome浏览器，访问
chrome://extensions/ - 开启右上角的"开发者模式"
- 点击"加载已解压的扩展程序"
- 选择已解压的文件夹
📖 使用说明
- 访问GitHub项目: 打开任何GitHub项目页面
- 查看Markdown文件: 打开任意.md文件（README、文档、Wiki等）
- 预览图片 :
- 点击Markdown文件中的任意图片
- 或点击"预览图片"按钮
- 导航浏览 :
- 鼠标悬停时显示左右箭头按钮
- 使用键盘方向键切换图片
- 点击下载按钮保存图片到本地
- 点击关闭按钮或按ESC键关闭预览
- 快速IDE :
- 在GitHub项目页面找到"Open IDE"按钮（位于Code按钮左边）
- 点击按钮在新标签页中打开github.dev在线编辑器
⌨️ 快捷键
←/→: 上一张/下一张图片+/-: 放大/缩小图片0: 重置缩放Esc: 关闭预览窗口- 鼠标滚轮 : 缩放图片
- 双击图片 : 重置缩放
- 拖拽 : 移动放大的图片
🛠️ 技术栈
- Manifest V3: 使用最新的Chrome扩展API
- Vanilla JavaScript: 无框架依赖，轻量高效
- CSS3: 现代化的响应式设计
- GitHub API: 智能解析图片URL
🎨 界面预览
主要功能
- ✅ 自动检测所有.md文件中的图片
- ✅ 美观的预览弹窗
- ✅ 流畅的图片导航
- ✅ 响应式设计
支持的图片格式
- PNG, JPG, JPEG
- GIF, SVG, WebP
- 相对路径和绝对路径
- GitHub raw链接
仓库地址
如果这个插件对您有帮助，请给个⭐️支持一下！