简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW)
javascript - 网页多层背景效果如何实现
巴扎黑
巴扎黑 2017-04-11 12:47:59
0 3 621

http://www.bilibili.com/html/...
类似如上页面的banner部分，是用什么样的方式实现的？

巴扎黑
巴扎黑

reply all(3)
洪涛
洪涛2017-04-11 12:49:59 3 floor

总共用了5个p,设置每个背景图片,图片格式均为png图片,然后对每个p都设置了transform:translate();
监听用户的滚动事件scroll,并且设置不同的递增值.然后错位视觉滚动就来了,有兴趣自己可以去搜索下.
五张图为:
Like +0
Add Reply
Peter_Zhu
Peter_Zhu2017-04-11 12:49:59 2 floor

可以设置一个有透明度的 p
Like +0
Add Reply
阿神
阿神2017-04-11 12:49:59 1 floor

图像处理软件制作
或者
背景图像 上面覆盖 RGBA背景的p 再覆盖 PNG图像
Like +0
Add Reply
Popular Topics
More>
Popular Articles
Popular Tutorials
More>
Related Tutorials
Popular Recommendations
Latest courses
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn：Public welfare online PHP training，Help PHP learners grow quickly！