零基础建站培训介绍

当前位置:

网站animite动画载入效果制作步骤

我们经常看到有些网站,打开后,会出现一个从下向上的滑动展示,还有的版块是从左到右的滑动等等效果,这就是使用了animite载入动画效果。那么在我们学习怎么建网站时,如何在自己的网站上应用这样的animite动画载入效果呢?

animate动画滑动加载网页

方法/步骤

  1. 第一步:引入动画插件必需的二个文件:wow.min.js和animate.css
  2. 第二步:加载javascript方法:
    
    
    new WOW().init();
  3. 第三步:使用对象添加 class="wow animate名" 这样的类
  4. 第四步:选择自己需要的动画效果。地址:http://daneden.github.io/animate.css/

可用属性:

data-wow-duration(动画持续时间)data-wow-duration="2s"
data-wow-delay(动画延迟时间) data-wow-delay="5s"
data-wow-offset(偏移量)data-wow-offset="10" 距离可视区域多远开始执行动画
data-wow-iteration="10"(重复次数) data-wow-iteration="10"

详细网站animite动画载入效果制作步骤,请查看如何实现animate动画滑动加载网页

发表评论

零基础学建站就到学做网站论坛