视差css背景图像移动一点

时间:2016-11-20 02:40:12

标签: html css image css3 parallax

我有来自background-url的背景图片,当我放置时,我的视差适用于图像:background-attachment: fixed;

当我滚动时,如何使背景图像移动一点?

以下是我所谈论的例子:

这是我滚动时的内容:http://www.w3schools.com/howto/tryhow_css_parallax_demo.htm

滚动时,这就是我想要的: http://materializecss.com/parallax-demo.html

2 个答案:

答案 0 :(得分:2)

也许this link会帮助它使用Javascript移动背景图片

修改

我刚刚意识到这只能起作用,因为背景图像是重复的图案。如果您想使用普通图像执行此效果,可以使用Parallax.js

答案 1 :(得分:0)

您可以结合使用CSS3的transformtransition属性来使背景图像具有动画效果。这是一个link如何做到这一点。您可以使用Javascript的onscroll事件触发我在悬停时触发的内容。