纯CSS的视差滚动效果在Chrome for Android上的实现

3

Keith Clark写了一个优秀的、极简的演示文稿,仅使用CSS实现视差滚动效果,使用perspective: 1pxoverflow-y: auto和宽度为100vw的容器。

然而,如果您使用Chrome for Android访问该页面(我尚未尝试其他移动设备,欢迎评论),它将无法工作。我使用的是Chrome 37.0.2062.117,Android 4.4.4,Nexus 4。

我已经尝试过-webkit-。但对于演示文稿来说不起作用。

网站上有一个相关问题,但在Chrome for Android上也不起作用——我的手机上没有视差滚动效果。

是否有人可以基于演示文稿提供一个纯CSS解决方案,可以在Chrome for Android上正常工作?


1
不仅仅是 Android 上的 Chrome。在 Mac 上的 Chrome(M37)上也无法工作。他的博客文章在页面顶部提到了这一点,并提到了如何暂时解决这个问题。 - Brian
1
演示在我的LG Optimus 4X HD上运行Android 4.4.4的Chrome Beta 38.0.2125.57(Blink 537.36 @ 181577)上完美运行,因此我们应该很快就能在Chrome稳定版中看到它的运行。 - iSWORD
谢谢。我可以确认它在 Mac 上的 Chrome M37 上有效,所以也许我应该切换到 Chrome beta。 - Xavier Ho
似乎又不起作用了。 - Chris Nevill
2个回答

0
原来这只是Chrome M37中的一个错误。版本38运行良好!

0

http://www.skullysystems.com 是我所知道的唯一一个在所有浏览器上都能正常工作的解决方案的网站,我不确定他们是否使用了某个库或者是自己编写的脚本。你可以尝试反向工程他们所构建的内容。


网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接