爱意满满的作品展示区。
qsfun

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

  •  
  •   qsfun · Oct 15, 2017 · 7978 views
    This topic created in 3311 days ago, the information mentioned may be changed or developed.

    视频预览:

    https://youtu.be/JIjICyI-Y4s

    插件地址:

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

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

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

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

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

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

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

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