css3加载中
.loader {
margin: 6em auto;
font-size: 10px;
position: relative;
text-indent: -9999em;
border-top: 1.1em solid rgba(255, 255, 255, 0.2);
border-right: 1.1em solid rgba(255, 255, 255, 0.2);
border-bottom: 1.1em solid rgba(255, 255, 255, 0.2);
border-left: 1.1em solid #ffffff;
-webkit-animation: load8 1.1s infinite linear;
animation: load8 1.1s infinite linear;
}
.loader,
.loader:after {
border-radius: 50%;
width: 10em;
height: 10em;
}
@-webkit-keyframes load8 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes load8 {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
html:
<div class="load-container load8">
<div class="loader">加载中...</div>
<a href="#load8">< 源代码 ></a>
</div>
css3加载中的更多相关文章
- 纯CSS3技术 加载中
你能相信吗?这些都是由一个DIV元素实现的动画,纯CSS3技术 html <div class="loader">加载中...</div> css: 图( ...
- css3动画-加载中...
写几个简单的加载中动画吧. 像前面三种都是相当于几个不同的点轮流来播放同一动画:变大变小.css3里面有一个用于尺度变换的方法:scale(x,y):定义 2D 缩放转换,改变元素的宽度和高度. 第四 ...
- css3加载ing动画
项目中ajax交互成功前总会需要给用户提醒,比如请稍候.正在加载中等等,那个等待的动图以前项目中用的是gif,在移动端画质很渣,有毛边,于是在新项目中用css3展示加载中的动画效果. function ...
- 纯css3 加载loading动画特效
最近项目中要实现当页面还没有加载完给用户提示正在加载的loading,本来是想做个图片提示的,但是图片如果放大电脑的分辨率就会感觉到很虚,体验效果很不好.于是就采用css3+js实现这个loading ...
- WebView 一直展示加载中。。。
webview加载html5页面总是一直在加载中,加载很慢或干脆加载不出来, 听浏览器的大牛说可能是 js导致的,尝试在onpause里加入mWebView.pauseTimers(), onResu ...
- JQuery插件:遮罩+数据加载中。。。(特点:遮你想遮,罩你想罩)
在很多项目中都会涉及到数据加载.数据加载有时可能会是2-3秒,为了给一个友好的提示,一般都会给一个[数据加载中...]的提示.今天就做了一个这样的提示框. 先去jQuery官网看看怎么写jQuery插 ...
- jquery mobile 请求数据方法执行时显示加载中提示框
在jquery mobile开发中,经常需要调用ajax方法,异步获取数据,如果异步获取数据方法由于网速等等的原因,会有一个反应时间,如果能在点击按钮后数据处理期间,给一个正在加载的提示,客户体验会更 ...
- jQuery Mobile 手动显示ajax加载器,提示加载中...
在使用jQuery Mobile开发时,有时候我们需要在请求ajax期间,显示加载提示框(例如:一个旋转图片+一个提示:加载中...).这个时候,我们可以手动显示jQuery Mobile的加载器,大 ...
- discuz微社区 始终显示“正在加载中”
使用DZ的tools工具一键关闭所有插件后,帮我排查了js冲突的问题,但是也带来了一系列后患: 云平台连“QQ互联”也失效了,之前云平台的各项业务已经不正常,无法开启关闭,提示“远程接口无法调用... ...
随机推荐
- cocos2dx shader
http://www.oschina.net/question/565065_79818 Cocos2d-x 2.0 -- 从 点,线,面学起 http://blog.csdn.net/dawn_mo ...
- BeagleBone Black Linux驱动程序开发入门(0): 开发环境
搭建arm-linux交叉编译环境的教程有很多,这里只作简要说明.Host宿主机是Ubuntu10.04,我把它装在Windows XP的VirtualBox虚拟机中,这样相当于一台主机有两个操作系统 ...
- angularjs填写表单
https://scotch.io/tutorials/handling-checkboxes-and-radio-buttons-in-angular-forms <!DOCTYPE html ...
- [置顶] c#对于文件的操作
在system.iO:命名空间中提供了两种遍历枚举文件夹的类,Directory 和DirectoryInfo, 他们都有一个方法GetDirectories():来便利枚举文件夹, /// < ...
- Magento 的程序架构与流程
以下是分别详细解读分析程序的各层次源码: MAGENTO_ROOT: //入口文件 /index.php -----–| 1.判断php版本是否大于5.22.引入Magento主要的中心类/app/M ...
- 响应式框架中,table表头自动换行的解决办法
最近在用bootstrap开发网站,在处理一张table的时候发现,通过PC端查看样式正常,在手机上查看时,因为屏幕小,表格被压缩的厉害,表头和数据变形如下图 后来网上找了一下,发现一个好用的CSS属 ...
- TPL(Task Parallel Library)多线程、并发功能
The Task Parallel Library (TPL) is a set of public types and APIs in the System.Threading and System ...
- CSS当中color的四种表示方法
这是我的第一篇博客,所以写的东西会比较简单. css当中,好多地方都会用到color属性,用来使html内容丰富多彩,例如:background-color:border-color: 第一种表示法使 ...
- rapidxml对unicode的支持
为了提高duilib创建布局控件的效率,在LuaDui项目中使用rapidxml解析器替换了duilib库自带的xml解析器. duilib使用unicode编译,所以rapidxml需要解析unic ...
- SGU 281.Championship
题意: 有n(n≤50000)支队伍参加了两场比赛,分别有两个排名.现在要求输出总排名,如果对任意m,在两个排名的前m个队伍都相同,那么在总排名前m个队伍就是这些队伍.其它情况按字典序排. Solut ...