这种图片的效果是怎么做的呢？

2016-09-15 22:04:10 +08:00
 isbase
3099 次点击
所在节点    CSS
9 条回复
tension
2016-09-15 22:11:27 +08:00
GIF?
designer
2016-09-15 22:13:18 +08:00
PS AE 都行吧 其实就是 错位的滤镜都懂了下。挺简单的
isbase
2016-09-15 22:20:01 +08:00
@tension
@designer
http://www.kikk.be/2016/files/templates/kikk2016/public/assets//images/portals/little-kikk.jpg
这个图片本身是不会动的

http://www.kikk.be/2016/
est
2016-09-15 22:35:23 +08:00
canvas?
tension
2016-09-15 22:37:12 +08:00
有层 canvas ！ JS 写的吧。。
sherlocktheplant
2016-09-16 01:32:18 +08:00
不用 Canvas 直接在原图的父标签上在 absolute 定位 然后用一张一模一样的图作背景 然后用 js 计算并改变 top 的值和背景图的 Y 坐标以及标签的高度 就可以做出来这个效果
sherlocktheplant
2016-09-16 01:33:46 +08:00
仔细看了一下 那个镜头散射的效果用我说的办法不行 那个必须得用 canvas
Perry
2016-09-17 01:01:20 +08:00
https://ihatetomatoes.net/how-to-create-css-glitch-effect/
Perry
2016-09-17 01:03:17 +08:00
不过上面的链接没有解释图片的效果是怎么弄出来的

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

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

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

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

© 2021 V2EX