Question

http://brightmedia.pl/?lang=en&site=intro

当我们滚动页面时，屏幕上有哪些技术可以使白线跟随？

是否与http://www.flyacts.com/multi-channel-app/中使用的技能相同，因为我们滚动时线条会慢慢下降？

Answer 1

它主要用于画布元素！如果您仔细查看过HTML的以下部分，您将会了解。

<head>...</head>
<body id="page" class="bodyEnableScroll">
<div id="bg" class="" style="width: 100%; height: 7738px;">
     <canvas id="mainBgC" height="438" width="1440" style="width: 1440px; height: 438px;"></canvas>
     <canvas id="shinesBgC" height="438" width="1440" style="width: 1440px; height: 438px;"></canvas>
     <canvas id="animationC" height="438" width="1440" style="width: 1440px; height: 438px;"></canvas>
</div>

所以有 mainBgC ， shinesBgC ， animationC 非常用于制作动画，并在网页上随时添加动态光泽向上和向下滚动。

每个部分的所有文本内容都使用了 textContainer0 ... 4 divs

此外，他们还为每个向上/向下滚动时显示在各部分之间的对象使用了以下JS Scripts： crown。js，heart.js，rose.js，tech.js

他们也使用了以下website中的产品，因为我在挖掘时已经知道了。特别是以下库：

TimelineLite - 为了制作Tweens，请自行检查，特别是在该页面中运行Demo。
TweenLite - 对于四个物体的补间，皇冠，玫瑰，心脏和技术。
基本上我能说的是他们可能使用了Greensock

这就是我能找到的所有东西。你最好沿着这条路走。

希望这对你有所帮助！

干杯！

Answer 2

These are some library files that are used to achieve that Kind of effect in above Sites.

    TweenLite
    TimelineLite
    ScrollToPlugin
    EasePack

You Can See the documentation and download from below:-

http://modernizr.com    
http://greensock.com/get-started-js  
https://greensock.com/ScrollToPlugin 
https://greensock.com/tweenmax  
You Could Use the Some Animation that are provided by jquery
such as easeIn our easeOut to achieve the Smooth Scrolling Effect.
You could use this library Which I use For Achieving the Same purpose as shown in the Site

http://janpaepke.github.io/ScrollMagic/

本网站使用了哪些技术？

2 个答案: