求推荐点击图片变暗剩余部分,弹出选中区域介绍的前端组件

2022-09-27 18:37:28 +08:00
 edis0n0
要求能通过鼠标滚轮缩放图片,然后通过鼠标拖拽。

随手画的效果图:
i.ibb.co/DrFhhKC/Untitled.png
1119 次点击
所在节点    程序员
10 条回复
johnnyNg
2022-09-27 19:38:22 +08:00
自己写吧
RealJacob
2022-09-27 19:49:27 +08:00
driver.js 感觉可以满足
RealJacob
2022-09-27 19:55:14 +08:00
@RealJacob 没注意到滚轮和拖拽,这个就不清楚了,感觉得自己实现下
zyronon
2022-09-27 20:18:28 +08:00
现成的没有。鼠标滚轮缩放图片,以图片中心点缩放最简单,如果要以 hover 点缩放,需要用到矩阵。其他就是普通的 js 了
TMaize
2022-09-27 20:25:32 +08:00
用 fabricjs 画吧
jifengg
2022-09-28 08:54:49 +08:00
你要找的是不是”viewerjs“
edis0n0
2022-09-28 10:22:46 +08:00
@jifengg 看来下这个没办法点击指定不规则区域变暗剩余区域呀
dudubaba
2022-09-28 11:04:11 +08:00
自己写也不难吧,选中图片 ,蒙层出现,计算图片的实际位置,复制图片然后 z-index 定位在蒙层上面,看起来就像其他区域变暗了。然后加手势对新图片缩放等操作。
cangcang
2022-09-28 14:38:24 +08:00
d3.js
SmiteChow
2022-09-29 12:34:33 +08:00
svg 层

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/883348

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX