<a href="javascript:" class="login">登录中<span class="dotting"></span></a>
 .dotting { display: inline-block; width: 10px; min-height: 2px;
padding-right: 2px;
border-left: 2px solid currentColor; border-right: 2px solid currentColor;
background-color: currentColor; background-clip: content-box;
box-sizing: border-box;
-webkit-animation: dot 1.5s infinite step-start both;
animation: dot 1.5s infinite step-start both;
*zoom: expression(this.innerHTML = '...'); /*IE7 */
}
.dotting:before { content: '...'; } /* IE8 */
.dotting::before { content: ''; }
:root .dotting { margin-left: 2px; padding-left: 2px; } /* IE9+ */ @-o-keyframes dot {
25% { border-color: transparent; background-color: transparent; }
50% { border-right-color: transparent; background-color: transparent; }
75% { border-right-color: transparent; }
}
@-ms-keyframes dot {
25% { border-color: transparent; background-color: transparent; }
50% { border-right-color: transparent; background-color: transparent; }
75% { border-right-color: transparent; }
}
@-moz-keyframes dot {
25% { border-color: transparent; background-color: transparent; }
50% { border-right-color: transparent; background-color: transparent; }
75% { border-right-color: transparent; }
}
@-webkit-keyframes dot {
25% { border-color: transparent; background-color: transparent; }
50% { border-right-color: transparent; background-color: transparent; }
75% { border-right-color: transparent; }
}
@keyframes dot {
25% { border-color: transparent; background-color: transparent; }
50% { border-right-color: transparent; background-color: transparent; }
75% { border-right-color: transparent; }
}

css3实现 依次出现三个点(一般用于提示加载中。。。 提交中。。。)的更多相关文章

  1. Java虚拟机(三):Java 类的加载机制

    1.什么是类的加载 类的加载指的是将类的.class文件中的二进制数据读入到内存中,将其放在运行时数据区的方法区内,然后在堆区创建一个java.lang.Class对象,用来封装类在方法区内的数据结构 ...

  2. 第三篇 Integration Services:增量加载-Adding Rows

    本篇文章是Integration Services系列的第三篇,详细内容请参考原文. 增量加载是什么增量加载仅加载与先前加载差异的.差异包括:->新增的行->更新的行->删除的行通过 ...

  3. 【译】第三篇 Integration Services:增量加载-Adding Rows

    本篇文章是Integration Services系列的第三篇,详细内容请参考原文. 增量加载是什么增量加载仅加载与先前加载差异的.差异包括:->新增的行->更新的行->删除的行通过 ...

  4. EF 学习系列三 数据操作数据加载及EF中执行Sql

    1.实体状态 我们通过EF来对数据库进行操作并持久化到数据库,那么EF必然通过EF上下文来维护实体的状态,明确知道每一个状态所对应的操作.也就是说EF通过上下文负责跟踪实体的状态.EF实体状态存在命名 ...

  5. 通过三次优化,我将gif加载优化了16.9%

    WeTest 导读 现在app越来越炫,动不动就搞点动画,复杂的动画用原生实现起来挺复杂,如是就搞起gif播放动画的形式,节省开发成本.   背 景 设计同学准备给一个png序列,开发读取png序列, ...

  6. 三步解决 vue 按需加载

    1  webpack 的 output 配置 chunkFleName 树干名称: " chunks/[name]-[chunkhash:8].js  " 这一步是配合第三步, 生 ...

  7. 第三课:sea.js模块加载原理

    模块加载,其实就是把js分成很多个模块,便于开发和维护.因此加载很多js模块的时候,需要动态的加载,以便提高用户体验. 在介绍模块加载库之前,先介绍一个方法. 动态加载js方法: function l ...

  8. 【Android】Handler的应用(三):从服务器端分页加载更新ListView

    在前面两节中,我们了解了如何从服务器中加载JSON数据. 现在,我们将把服务器中的JSON数据加载更新到ListView. 并且,结合之前博文的  “动态追加分页ListView数据”的相关知识,实现 ...

  9. Universal-Image-Loader解析(三)——用ListView和ViewPager加载网络中的图片

           现在我们终于可以通过这个框架来实现ListView中加载图片了,至于ViewPager还是别的,原理其实都是一样的 一.ListView 1.布局文件 list_layout.xml & ...

随机推荐

  1. SQL SERVER 原来还可以这样玩 FOR XML PATH

    FOR XML PATH 有的人可能知道有的人可能不知道,其实它就是将查询结果集以XML形式展现,有了它我们可以简化我们的查询语句实现一些以前可能需要借助函数活存储过程来完成的工作.那么以一个实例为主 ...

  2. jquery序列化from表单使用ajax提交返回json数据(使用struts2注解result type = json)

    1.action类引入struts2的"json-default"拦截器栈 @ParentPackage("json-default") //示例 @Paren ...

  3. 小白学习之Code First(四)

    code first :约定大于配置(通过配置实体重写约定) 通过两种方式配置实体:DataAnnotations      Fluent Api System.ComponentModel.Data ...

  4. DOM-添加元素、节点

    createElement()方法能够根据参数指定的标签名称创建一个新元素,并返回新建元素的引用,用法如下 var element=document.createElement("tagNa ...

  5. CSS3 transition 过度

    一个元素在不同的状态之间进行平滑的交换 CSS3中使用transition属性实现过度效果 一个简单的例子: img{ background-image:url("img/1.jpg&quo ...

  6. servlet(一):从Sevlet到HttpServlet

    Java Servlet 是运行在 Web 服务器或应用服务器上的程序,它是作为来自 Web 浏览器或其他 HTTP 客户端的请求和 HTTP 服务器上的数据库或应用程序之间的中间层. servlet ...

  7. MYSQL与MSSQL对比学习

    最近在将公司的一个产品里面相关的MSSQL语句修改为可以在MYSQL上执行的语句 l  优点分析: MYSQL短小精悍,容易上手,操作简单,免费供用的.相对其它数据库有特色又实用的语法多一些.SQL怎 ...

  8. Android开发之旅2:HelloWorld项目的目录结构

    引言 前面Android开发之旅:环境搭建及HelloWorld,我们介绍了如何搭建Android开发环境及简单地建立一个HelloWorld项目,本篇将通过HelloWorld项目来介绍Androi ...

  9. jQuery 遮盖层弹出后禁止页面滚动

    css部分 .ovfHiden{     overflow: hidden;     height: 100%; }     js部分 $(".btn1").click(funct ...

  10. Strut2开发经验总结

    1.如何在html静态页面中使用struts tomcat目录/conf/web.xml 文件中,找到 <servlet-mapping> <servlet-name>jsp& ...