【问题标题】:What technology used in this website? [closed]本网站使用了什么技术? [关闭]
【发布时间】:2015-05-17 13:22:05
【问题描述】:

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

当我们滚动页面时,曾经有什么技术在屏幕上显示白线?

当我们滚动浏览时,线会慢慢下降,这与 http://www.flyacts.com/multi-channel-app/ 中使用的技能是否相同?

【问题讨论】:

  • 在 jquery 中有一个名为 .scrollTop() 的属性。我认为他们使用这样的东西来检测用户在网站上的位置,而不是为网站的那个部分制作动画
  • parallax.jsskrollr.js 例如。
  • 我在回答中添加了更多信息,请检查!
  • 投票结束这个问题,因为如果网站作者更改了他的网站,这些类型的问题将变得无效,并且它们的价值很小。

标签: javascript html css


【解决方案1】:

主要用于canvas元素! 如果您仔细查看了 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>

所以有 ma​​inBgCshinesBgCanimationC​​trong> 很好地用于制作动画并在网页时为整个网站添加动态闪耀上下滚动。

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

他们还为每个在您向上/向下滚动时显示在部分之间的对象使用了以下 JS 脚本: crown.js、heart.js、rose.js、tech.js

而且他们还使用了以下website 的产品,正如我在挖掘时所知道的那样。特别是以下库:

  1. TimelineLite - 关于 Tweens 的制作,请自行查看,专门运行该页面中的 Demo。
  2. TweenLite - 四个对象的补间,Crown、Rose、Heart 和 Tech。
  3. 所以基本上我可以说他们可能使用了更多Greensock在本网站中提到的插件

目前我能找到的就只有这些了。 最好顺着这条路走。

希望这对您有所帮助!

干杯!

【讨论】:

    【解决方案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/
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2023-03-03
      • 1970-01-01
      • 2012-06-28
      • 2010-09-28
      • 1970-01-01
      相关资源
      最近更新 更多