aos.js-超赞页面滚动元素动画jQuery动画库

时间：2016-07-08 来源：互联网

特效说明：

一款aos.js-超赞页面滚动元素动画jQuery动画库源码下载，该动画库可以在页面滚动时提供28种不同的动画元素展示效果，以及多种easing效果。在页面往回滚动时，元素会恢复到原来的状态。请用支持HTML5+CSS3主流浏览器预览效果。（兼容测试：IE10、Firefox、Chrome、Opera、Safari、360等支持HTML5+CSS3主流浏览器）

使用方法：

1、调用CSS样式：
<link rel="stylesheet" type="text/css" href="css/normalize.css" />
<link rel="stylesheet" type="text/css" href="css/htmleaf-demo.css">
<link rel="stylesheet" href="dist/aos.css" />
<link rel="stylesheet" href="css/styles.css" />

2、调用JS插件代码：
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/highlight.min.js"></script>
<script src="dist/aos.js"></script>
<script>
       AOS.init({
           easing: 'ease-out-back',
           duration: 1000
       });
</script>
<script>
       hljs.initHighlightingOnLoad();

       $('.hero__scroll').on('click', function(e) {
           $('html, body').animate({
               scrollTop: $(window).height()
           }, 1200);
       });
</script>

3、添加HTML代码：
将......之间的html和js代码；放在<body></body>之间。

标签网页动画 jQuery动画滚动动画 CSS3动画库

预览收藏分享评论