人靠衣装,机靠壳装

loading加载CSS3动画特效库

2018-06-27 10:21 发布

00
admin
湖南省 长沙市
  • 粉丝4

  • 关注1

  • 动态2

loading加载CSS3动画特效库_niuqiqi270939.png


three-dots.css中集成了14种三园点loading动画特效,以及三种增强动画效果。


使用方法

在页面中引入three-dots.css

<link href="css/three-dots.css" rel="stylesheet">


HTML结构

然后在你需要添加Loading效果的容器上添加相应的class类即可。

<div class="dot-elastic"></div>

<div class="dot-pulse"></div>

<div class="dot-flashing"></div>

<div class="dot-collision"></div>

<div class="dot-revolution"></div>

<div class="dot-translation"></div>

<div class="dot-typing"></div>

<div class="dot-windmill"></div>

<div class="dot-bricks"></div>

<div class="dot-floating"></div>

可用的class类有:

  • dot-elastic

  • dot-pulse

  • dot-flashing

  • dot-collision

  • dot-revolution

  • dot-carousel

  • dot-typing

  • dot-windmill

  • dot-bricks

  • dot-floating

  • dot-fire

  • dot-spin

  • dot-falling

  • dot-stretching

 CSS3 loading加载动画特效库的github地址为:https://github.com/nzbin/three-dots


授权方式:共享版

适合环境: Chrome/Firefox/Opera/Safari/IE9+

官方网站: 暂无

在线演示

0
猜你喜欢
更多发现
子导航JS代码