源码论坛,商业源码下载,尽在锦尚中国商业源码论坛

标题: jq强大的AOS页面滚动插件 [打印本页]

作者: 洪七公    时间: 2023-6-3 12:57
标题: jq强大的AOS页面滚动插件
高端的网站界面,在展示页面的时候是不是经常看到div从左从右或者从上从下慢慢过渡加载出来,这个效果非常不错,尤其是一些企业站特别喜欢,今天我们给出示例解析并且代码打包给大家!

1、引用css和js文件,并配置:

<script>
AOS.init();
</script>

2、通过使用data-aos-*属性调整行为,例如(对照下表):
       
<div data-aos="fade-up" data-aos-offset="200" data-aos-delay="50" data-aos-duration="1000" data-aos-easing="ease-in-out" data-aos-mirror="true" data-aos-once="false" data-aos-anchor-placement="top-center">
</div>
  
3、也可以通过全局控制属性值,例如(对照下表):
  
<script>
AOS.init({
        offset: 200,
        duration: 600,
        easing: 'ease-in-sine',
        delay: 100,
});
</script>

具体代码可以下载打包代码回家慢慢看!

github下载:https://github.com/michalsnik/aos






欢迎光临 源码论坛,商业源码下载,尽在锦尚中国商业源码论坛 (https://bbs.52jscn.com/) Powered by Discuz! X3.3