jQuery Loading效果插件 - shCircleLoader

导语 简介为了提高用户体验,给页面或应用加入 Loading 效果最基本最常见的方法。shCircleLoader 是一个基于 jQuery 的插件,它能够很方便快速的制作 Loading 效果。该 Loading 效果由多个 div 组成,没有

jQuery Loading效果插件

简介

为了提高用户体验,给页面或应用加入 Loading 效果最基本最常见的方法。shCircleLoader 是一个基于 jQuery 的插件,它能够很方便快速的制作 Loading 效果。该 Loading 效果由多个 div 组成,没有任何图片。shCircleLoader 还提供了众多属性,你可以根据这些属性自定义出各种各样的 Loading 效果。

兼容

jQuery 兼容

兼容 jQuery 1.4+。

浏览器兼容

IE Chrome Firefox Opera Safari
IE10+ ✔ Chrome ✔ Firefox ✔ Opera ✔ Safari ✔

shCircleLoader 使用了 CSS3 属性,所以不兼容低版本 IE 浏览器。

使用方法

1、引入文件

<script src="js/jquery.min.js"></script>
<script src="js/jquery.shCircleLoader.js"></script>

2、HTML

HTML 结构非常简单,只需一个空元素即可,不过您最好指定一个宽度和高度,要不然无法看到 Loading 效果。

<div class="loading"></div>

3、JavaScript

$('.loading').shCircleLoader({
    //options
});

配置

属性/方法 类型 默认值 说明
namespace 字符串 shcl 命名空间,添加一个 class 名称
radius 字符串 auto Loading 的圆角弧度,默认值为 auto,将根据选择器的宽高自动计算
dotsRadius 字符串 auto 圆点圆角弧度
color 字符串 auto 圆点颜色,默认为 auto,将从选择器中获取
dots 整数 12 圆点的个数
duration 数值 1 每个圆点的动画时间,单位为秒
clockwise 布尔值 false 顺时针旋转
externalCss 布尔值 false 使用外部的 CSS,即不使用插件本身的 CSS
keyframes 字符串   自动 CSS3 动画效果,默认值为
0%{{prefix}transform:scale(1)}80%{{prefix}transform:scale(.3)}100%{{prefix}transform:scale(1)}
uaPrefixes 数组   前缀,用于兼容各种浏览器,默认值为 [‘o’, ‘ms’, ‘webkit’, ‘moz’, ”]
 

http://www.aseoe.com/ true jQuery Loading效果插件 - shCircleLoader http://www.aseoe.com/show-79-721-1.html report 1980.5 简介为了提高用户体验,给页面或应用加入 Loading 效果最基本最常见的方法。shCircleLoader 是一个基于 jQuery 的插件,它能够很方便快速的制作 Loading 效果。该 Loading 效果由多个 div 组成,没有
TAG:jQuery 插件 shCircleLoader
本站欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
转载请注明: 文章转载自:爱思资源网 http://www.aseoe.com/show-79-721-1.html

[前端插件推荐] Plugin

1 2 3 4
  • jQuery实现逐字逐句显示插件l-by-l.min.js
  • jQuery带方向感知的鼠标滑过图片边框特效插件
  • jQuery HotKeys监听键盘按下事件keydown插件
  • 响应式无限轮播jQuery旋转木马插件
响应式无限轮播jQuery旋转木马插件
web前端开发
爱思资源网 Copyright 2012-2014 Www.Aseoe.Com All rights reserved.(晋ICP备13001436号-1)