背景视差效果

Question

我正在尝试使用与本网站 http://brightmedia.pl/ 中实施的背景效果完全相似的背景效果来创建网站。 在检查通过鼠标移动和滚动在背景上创建视差效果的 div 元素时，我们可以看到它正在改变鼠标移动时元素的 translate3D() 属性。请指导我如何实现相同的背景效果？

Answer 1

请阅读以下文章，了解如何实现视差效果。第一步是创建视差效果，然后您可以实现线条效果并根据需要进行修改。

如何创建视差滚动网站： https://ihatetomatoes.net/how-to-create-a-parallax-scrolling-website

简单视差滚动是： https://ihatetomatoes.net/demos/simple-parallax-scrolling-tutorial/

如何创建视差滚动效果： https://www.w3schools.com/howto/howto_css_parallax.asp

如何 - 滚动绘图： https://www.w3schools.com/howto/howto_js_scrolldrawing.asp

SVG 线条动画的工作原理： https://css-tricks.com/svg-line-animation-works/

Please find below 21 Impressive SVG Line Animation along with the code:

21 令人印象深刻的 SVG 线条动画示例： http://bashooka.com/coding/impressive-svg-line-animation-examples/