UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

12种纯CSS3 Loader加载指示器动画特效

所属分类：其他,UI-动画效果,加载

 39197  498  查看评论 (4)
分享到微信朋友圈
X
12种纯CSS3 Loader加载指示器动画特效 ie兼容10
 查看演示  website  立即下载

loaderskit说明

loaderskit是一款效果非常炫酷的纯CSS3 Loader加载指示器动画特效。该Loader加载指示器动画特效共12种效果，动画效果全部使用CSS3来完成，没有使用任何图片。

使用方法

在页面中引入loaderskit.css文件。

<link rel="stylesheet" type="text/css" href="css/loaderskit.css">

HTML结构

所有的Loader指示器的HTML结构均相同，使用一个<div>作为容器，里面再嵌套一个<div>元素。例如：

<div class="span">
  <div class="timer"></div>
</div>

class timer为指定Loader的动画类型，可用的类型有：

  • timer

  • typing

  • location indicator

  • dashboard

  • battery

  • magnifier

  • help

  • cloud

  • eye

  • coffee cup

  • square

  • circle


相关插件-动画效果,加载
查看更多

超级牛B的js效果

 跟上一个心的形状用的类似的方法。不用我多说，看了就知道有多牛B了哦。可兼容手机。暂停之后一个手指拖动改变视角，两个手指可以调整视角的大小，三个手指可以移动。
  动画效果
 59186  331

css实现任务奔跑

 利用backgroundposition，实现人物跑步的动画 ，并且支持快慢，暂停等
  动画效果
 34526  446

Google loading 纯CSS3加载动画特效(部分原创)

 Google风格为主题，运用CSS3实现加载动画特效
  动画效果
 30475  375

用纯CSS3制作的效果非常炫酷的元素边框线条动画特效

 这是一款使用纯CSS3制作的效果非常炫酷的元素边框线条动画特效。这个元素边框线条动画使用伪元素和keyframes来制作线条运动效果。
  动画效果
 239194  619

讨论这个项目（4）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    pupunew 0
    2017/4/26 13:44:42

    非常?用  感著！

    回复
    Virtual 0
    2016/12/6 14:12:40
    秦时明月? 0
    2016/12/5 11:12:05
    效果太少了  要是再多些就好了
        MrSong0
        2018/10/11 17:29:47
        史蒂夫
    回复
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复