平滑滚动控制动画的JavaScript插件:Scrollissimo

dc4g 9年前

平滑滚动控制动画的JavaScript插件:Scrollissimo。

Scrollissimo animates Greensock's tweens and timelines on user's scroll.

Comparing Scrollissimo and another default plugins here.

Get started

Download

Scrollissimo is available for downloading from repository. Also bower users can install Scrollissimo by command:

bower install scrollissimo

Connect

The first step you need is to include Greensock:

<script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenLite.min.js"></script>  <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TimelineLite.min.js"></script>  <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/plugins/CSSPlugin.min.js"></script>

... or just:

 <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/latest/TweenMax.min.js"></script>

... and Scrollissimo of course:

 <script src="scrollissimo/dist/scrollissimo.min.js"></script>

To support touch devices you also need to include touch adapter:

 <script src="scrollissimo/dist/scrollissimo.touch.min.js"></script>

Next we will trigger Scrollissimo on each scroll event:

<script>      $(document).ready(function(){          $(window).scroll(function(){              Scrollissimo.knock();          });      });  </script>

项目主页:http://www.open-open.com/lib/view/home/1439888660801