刷新页面缓存动作

css样式

<style>
html,body{width:100%;height:100%;}
html,body,div{margin:0;padding:0;}
   #bodyLoading{position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;z-index:999999;opacity:1;}
#loading-center-absolute{position:absolute;left:50%;top:50%;height:150px;width:150px;margin-top:-75px;margin-left:-75px;-moz-border-radius:50% 50% 50% 50%;-webkit-border-radius:50% 50% 50% 50%;border-radius:50% 50% 50% 50%;z-index:99999999999999;}
.object{width:15px;height:15px;background-color:#6cf;position:absolute;-moz-border-radius:50% 50% 50% 50%;-webkit-border-radius:50% 50% 50% 50%;border-radius:50% 50% 50% 50%;-webkit-animation:animate .8s infinite;animation:animate .8s infinite}
#object_one{top:19px;left:19px}
#object_two{top:0;left:65px;-webkit-animation-delay:.1s;animation-delay:.1s}
#object_three{top:19px;left:111px;-webkit-animation-delay:.2s;animation-delay:.2s}
#object_four{top:65px;left:130px;-webkit-animation-delay:.3s;animation-delay:.3s}
#object_five{top:111px;left:111px;-webkit-animation-delay:.4s;animation-delay:.4s}
#object_six{top:130px;left:65px;-webkit-animation-delay:.5s;animation-delay:.5s}
#object_seven{top:111px;left:19px;-webkit-animation-delay:.6s;animation-delay:.6s}
#object_eight{top:65px;left:0;-webkit-animation-delay:.7s;animation-delay:.7s}
@-webkit-keyframes animate{25%{-ms-transform:scale(1.5);-webkit-transform:scale(1.5);transform:scale(1.5)}
75%{-ms-transform:scale(0);-webkit-transform:scale(0);transform:scale(0)}
}
@keyframes animate{50%{-ms-transform:scale(1.5,1.5);-webkit-transform:scale(1.5,1.5);transform:scale(1.5,1.5)}
100%{-ms-transform:scale(1,1);-webkit-transform:scale(1,1);transform:scale(1,1)}
}
input[type=button]:disabled{background:#f9f6f6;border:none;color:#c7c7c7;cursor:not-allowed}
</style>


html内容

<div id="bodyLoading"></div>
  <div id="loading-center-absolute">
<div class="object" id="object_one"></div>
<div class="object" id="object_two"></div>
<div class="object" id="object_three"></div>
<div class="object" id="object_four"></div>
<div class="object" id="object_five"></div>
<div class="object" id="object_six"></div>
<div class="object" id="object_seven"></div>
<div class="object" id="object_eight"></div>
</div>


js

$(function(){
 $('#bodyLoading').remove();
 $('#loading-center-absolute').fadeOut(300);
 });

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值