平滑滚动控制动画的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>