<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>CSS3订单提交按钮Loading代码</title>
<style>
body{text-align: center}
.grebtn{
display: inline-block;
padding: 0.5em 1.25em;
border: 1px solid;
border-radius: 2px;
vertical-align: bottom;
font-weight: inherit;
border-color: #208000 #1F7F00;
background-color: #289600;
box-shadow: inset 0 0 1px rgba(255,255,255,.6), 0 1px #8DBF62;
color: #fff;
text-shadow: 0 -1px #137900;
margin: 100px auto;
}
dot {
display: inline-block;
height: 1em; line-height: 1;
text-align: left;
vertical-align: -.25em;
overflow: hidden;
}
dot::before {
display: block;
content: '...\A..\A.';
white-space: pre-wrap;
animation: dot 3s infinite step-start both;
}
@keyframes dot {
33% { transform: translateY(-2em); }
66% { transform: translateY(-1em); }
}
</style>
</head>
<body>

<div class="grebtn">订单提交中<dot>...</dot></div>

<div style="text-align:center;margin:50px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器：360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
</div>
</body>
</html>

CSS3订单提交按钮Loading代码的更多相关文章

  1. DJANGO-天天生鲜项目从0到1-011-订单-订单提交和创建

    本项目基于B站UP主‘神奇的老黄’的教学视频‘天天生鲜Django项目’,视频讲的非常好,推荐新手观看学习 https://www.bilibili.com/video/BV1vt41147K8?p= ...

  2. HTML中图像代替提交按钮

    1. 用图像代替提交按钮 当只有一个提交按钮的时候 ,可以简单的实现,不用添加事件函数,代码是: <input type = "image"' name = ".. ...

  3. jquery实时监测手机号是否符合规则，并根据手机号检测结果将提交按钮设为不同状态

    功能: 输入手机号,实时判断手机号输入的是否符合规则: 如果不合规则,则提交按钮为禁用状态,手机号信息不可提交,按钮显示灰色背景: 如果符合规则,则可提交所输入的手机号信息,并将按钮背景设成红色. 代 ...

  4. MVC项目实践,在三层架构下实现SportsStore-07,实现订单提交

    SportsStore是<精通ASP.NET MVC3框架(第三版)>中演示的MVC项目,在该项目中涵盖了MVC的众多方面,包括:使用DI容器.URL优化.导航.分页.购物车.订单.产品管 ...

  5. ASP.NET多次点击提交按钮以及Session超时和丢失过期问题

    1.ASP.NET防止多次点击提交按钮 对于一个按钮,要让变成恢色的,只要this.disabled=true就可以了,可是在.NET里,添加了OnClick事件后,就无法提交信息了.所以要加上以下代 ...

  6. CSS3实现8种Loading效果【第二波】

    原文:CSS3实现8种Loading效果[第二波] 今晚吃完饭回宿舍又捣鼓了另外几种Loading效果,老规矩,直接“上菜“…… 注:gif图片动画有些卡顿,非实际效果! PS:若要转载请注明出处,尊 ...

  7. CSS3实现10种Loading效果（转）

    CSS3实现10种Loading效果  原文地址:http://www.cnblogs.com/jr1993/p/4622039.html 昨晚用CSS3实现了几种常见的Loading效果,虽然很简单 ...

  8. ios开发之--textview意见反馈页面（占位label，字数统计，提交按钮的交互设置）

    记录一个页面的功能: textview的占位符,字数统计,提交按钮的交互设置,具体效果图如下:

  9. CSS3实现8种Loading效果【二】

    CSS3实现8种Loading效果[二]   今晚吃完饭回宿舍又捣鼓了另外几种Loading效果,老规矩,直接“上菜“…… 注:gif图片动画有些卡顿,非实际效果! 第一种效果: 代码如下: < ...

随机推荐

  1. 通过命令直接修改jar包中的静态文件

    1.先将要修改的jar包备份 copy xxx.jar xxx.jar_bak 2.建立一个新的目录便于后面的打包 mkdir jar_tmp 3.将包放到刚刚创建的目录里解压 mv xxx.jar ...

  2. hbase报错之 Master is initializing

    报错日志 ERROR: org.apache.hadoop.hbase.PleaseHoldException: Master is initializing at org.apache.hadoop ...

  3. DP---DAG、背包、LIS、LCS

    DP是真的难啊,感觉始终不入门路,还是太弱了┭┮﹏┭┮ DAG上的DP ​ 一般而言,题目中如果存在明显的严格偏序关系,并且求依靠此关系的最大/最小值,那么考虑是求DAG上的最短路或者是最长路.(据说 ...

  4. 20190925 On Java8 第二十二章 枚举

    第二十二章 枚举 基本 enum 特性 创建 enum 时,编译器会为你生成一个相关的类,这个类继承自 Java.lang.Enum. valueOf() 是在 Enum 中定义的 static 方法 ...

  5. SpringBoot 使用Mybatis+MySql

    pom配置 <?xml version="1.0" encoding="UTF-8"?> <project xmlns="http: ...

  6. java基础常问面试题

    1.面向对象和面向过程的区别 面向过程 :面向过程性能比面向对象高. 因为类调用时需要实例化,开销比较大,比较消耗资源,所以当性能是最重要的考量因素的时候,比如单片机.嵌入式开发.Linux/Unix ...

  7. 搜索---BFS

    搜索   深度优先搜索和广度优先搜索广泛的应用于树和图中,但是他们的应用远不止于此. BFS   广度优先搜索一层一层地进行遍历,每层遍历都是以上一层遍历的结果作为起点,遍历一个距离能访问到的所有节点 ...

  8. python 数据分析 Numpy(Numerical Python Basic)

    a = np.random.random((2,4)) a Out[5]: array([[0.20974732, 0.73822026, 0.82760722, 0.050551 ], [0.773 ...

  9. postgres - 以单用户模式运行一个 PostgreSQL服务器

    SYNOPSIS postgres [ -A 0 | 1] [ -B nbuffers] [ -c name=value] [ -d debug-level] [ --describe-config ...

  10. rabbitmq tags

    #用户角色####################### RabbitMQ的用户角色分类:none.management.policymaker.monitoring.administrator Ra ...