TV tvOS 视差效果海报( CSS+JavaScript/jQuery)

2015 年 9 月 21 日
 ceoimon

根据教程所作。

12MB 的 GIF 动态效果图

在线展示

Ps. 因为使用高分辨率素材,网页加载较慢。以及不适合没有鼠标的设备访问

实测 Firefox 浏览器体验不佳,建议使用 Chrome.

4056 次点击
所在节点    分享创造
12 条回复
DIYgod
2015 年 9 月 21 日
效果好漂亮!
Livid
2015 年 9 月 21 日
Chrome 的最后不动的时候也是有抗锯齿效果的,而 Firefox 没有,有趣。
ceoimon
2015 年 9 月 21 日
@Livid 但是在 Firefox 下鼠标连续滑动时并不会有动画啊,滑动结束后才动的,难道说只有我的电脑是这样的。
Livid
2015 年 9 月 21 日
@ceoimon 我在 Firefox 40.0.3 上可以正常使用,只是最后一帧的边缘有锯齿。
zonghua
2015 年 9 月 21 日
@Livid 为什么 gif 压缩之后呈现为很多点点
c742435
2015 年 9 月 21 日
@zonghua 因为一张 gif 能表现的色彩只有 256 种。表现不出来的色彩,就用叫“抖动”的方式混合得到。也就是,一个白点和一个色点混合得出高亮的色点
fatestigma
2015 年 9 月 21 日
Safari 下效果也好渣,但是 Chrome 的效果简直酷炫到没朋友。。。
ajan
2015 年 9 月 22 日
strom001
2015 年 9 月 22 日
我这是 el capitan 的 safari ,看着还行啊,有点点
1XNf2EUDzg0HN0KD
2015 年 9 月 22 日
Cool
windirt
2015 年 9 月 23 日
三个浏览器都测试了, Firefox 无论是流畅度和抗锯齿都不行, Safari 和 Chrome 效果一致
iheshix
2015 年 9 月 26 日
其实说实话,这次的发布会,这个 tvOS 其实算个亮点。大部分人都没看到细节。在细节上, Apple 确实牛逼。当初我看到这个 tvOS 的视差效果的时候都惊了。

首先要说的是,楼主做得好赞!
然后要说的是,其实我很好奇 Apple 是怎么做到的?电影库里那么多电影,全部收工处理貌似不太现实,难道全部都是图形分析算法按路径差异来自动处理的?如果是后者,那就牛逼了。

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

https://study.congcong.us/t/222528

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

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

© 2021 V2EX