V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
爱意满满的作品展示区。
qsfun
V2EX  ›  分享创造

分享一个 chrome 看图增强插件, 支持在浏览器中直接拖拽 / 缩放 / 旋转

  •  
  •   qsfun · 2017-10-15 10:43:52 +08:00 · 6558 次点击
    这是一个创建于 2594 天前的主题,其中的信息可能已经有所发展或是发生改变。

    视频预览:

    https://youtu.be/JIjICyI-Y4s

    插件地址:

    https://chrome.google.com/webstore/detail/better-image-browser/kiogkahifhldimpknnnhdiemepmebnhe

    做这个的原因是因为产品给的需求单中, 一般包含大图, chrome 自身的图片浏览能力有限, 不支持鼠标拖拽 / 滚轮缩放 / 旋转, 比较不便.

    因此我开发了这款插件, 操作手感参照于 google picasa 来实现.

    另外, 在 mac 系统中该插件是不生效的, 因为考虑到触摸板本身已经比较好用, 而开启这个功能会和触摸板的双指移动功能冲突, 所以屏蔽了 mac.

    第 1 条附言  ·  2017-10-15 22:28:36 +08:00
    感谢#1 @cyio 的提议, 为适配 mac 触摸板 / 鼠标的场景, 增加了一个开关, 点击扩展图标即可选择启用或禁用.
    第 2 条附言  ·  2017-10-18 14:47:00 +08:00
    22 条回复    2017-12-14 10:36:26 +08:00
    cyio
        1
    cyio  
       2017-10-15 11:12:51 +08:00   ❤️ 1
    加个开关吧,用 macbook 大部分时间是外接鼠标的
    qsfun
        2
    qsfun  
    OP
       2017-10-15 11:33:25 +08:00
    @cyio 也可以, 后面加上
    Haiwx
        3
    Haiwx  
       2017-10-15 12:58:09 +08:00
    前排更正“插件”->“扩展”,别打我,唉。另外是否有适配 Firefox ( 57+)的计划,谢谢。
    qsfun
        4
    qsfun  
    OP
       2017-10-15 13:47:59 +08:00
    @Haiwx #3 不打算, 平时基本不用 firefox
    Haiwx
        5
    Haiwx  
       2017-10-15 14:08:03 +08:00
    @qsfun 十分感谢,还是自己动手好了。
    iVeego
        6
    iVeego  
       2017-10-15 14:10:23 +08:00
    反馈个小问题:使用 V2 自己的图库,访问图片的页面, 例如这个,在登陆状态下无法显示图片,而是一个 V2EX 的 logo
    qsfun
        7
    qsfun  
    OP
       2017-10-15 14:11:51 +08:00 via iPhone   ❤️ 1
    @Haiwx #5 代码可以参考,js 那部分应该不怎么用改就能用

    https://github.com/QS20199/better-image-browser
    heiyutian
        8
    heiyutian  
       2017-10-15 16:18:32 +08:00 via Android
    记得提示说明勾选允许访问文件网址
    qsfun
        9
    qsfun  
    OP
       2017-10-15 18:48:31 +08:00
    @iVeego #6 额...看了下, V2 这个图库实现的不太常规, 虽然地址是.png 后缀, 但实际上是一个页面, 而非 image/png 类型. 这种我看看能不能兼容一下
    qsfun
        10
    qsfun  
    OP
       2017-10-15 19:42:41 +08:00
    @heiyutian #8 这个插件的场景主要针对在线的图片, 本地图片就没必要再用浏览器了吧
    Jackeriss
        11
    Jackeriss  
       2017-10-15 21:28:42 +08:00
    @qsfun 当然还是 png 类型的,只不过图片上的链接是个网页,图片的原始地址是 ,跳转地址是
    Jackeriss
        12
    Jackeriss  
       2017-10-15 21:32:00 +08:00   ❤️ 1
    @Jackeriss 自动转义了,原始地址是 https://i.v2ex.co/ + 图片名,跳转地址是 https://www.v2ex.com/i/ + 图片名。
    qsfun
        13
    qsfun  
    OP
       2017-10-15 22:25:25 +08:00
    @cyio #1 已经增加开关.

    @Jackeriss #12 已经适配了, 除了通过 url 后缀, 还会通过 content-type 来判断.

    已经发布更新, 1 小时内会生效, 用户侧会无感知更新
    cyio
        14
    cyio  
       2017-10-15 23:17:23 +08:00
    用上了,有几个问题:
    1. 扩展体积下载时,看到有 2-3Mb,略大
    2. 缩放百分比值的显示可以再改进下,我缩放只能看到 100%
    3. 进入时会闪一下
    4. 禁用时,图标应该变灰
    cyio
        15
    cyio  
       2017-10-15 23:25:55 +08:00
    picasa 的图片查看,确实是用起来最爽的,以前只要用 windows 都会装一下
    感谢楼主把这个体验,带到浏览器,期待整理好代码开源
    qsfun
        16
    qsfun  
    OP
       2017-10-16 10:55:02 +08:00
    @cyio #14
    1.的确比较大, 因为直接一起打包了 node_modules, 要处理一下也可以, 不过个人觉得 PC 端不是很有必要
    234 我抽空搞搞
    qsfun
        17
    qsfun  
    OP
       2017-10-16 22:18:04 +08:00
    @cyio #14 234 已经修正
    cyio
        18
    cyio  
       2017-10-17 08:35:22 +08:00
    @qsfun 上网小飞机挂了,估计得等到下个月更新体验了
    zhangneww
        19
    zhangneww  
       2017-10-17 20:41:16 +08:00
    只能在只有图片的标签页用啊,能不能增加对普通页面图片的处理
    qsfun
        20
    qsfun  
    OP
       2017-10-17 21:19:38 +08:00
    @zhangneww 这样做坑比较大, 可以右键图片-新标签页打开
    Love4Taylor
        21
    Love4Taylor  
       2017-10-24 17:52:11 +08:00
    右键菜单能不能做个 复制到剪贴板 啊.....
    qsfun
        22
    qsfun  
    OP
       2017-12-14 10:36:26 +08:00
    @Love4Taylor 不好意思才看到, 这个功能可以, 我抽空弄一下
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5779 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 53ms · UTC 02:30 · PVG 10:30 · LAX 18:30 · JFK 21:30
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.