loading图css实现

转载:https://www.cnblogs.com/sddychj/p/5567456.html

背景

这个是充分证明了我对js和css的不熟悉，之前一直用了个第三个插件实现加载等待功能，每次还挺麻烦，后来见了这位同事写的，这么简单。吓我一裤子。

实现 

 

<div id="divloading" class="bg-loading"><div class="loadingmsg">正在处理，请稍等...</div></div>

/*读取、载入等待*/
.bg-loading {
  width: 100%;
  height: 100%;
  background: url('../../Images/loading.gif') no-repeat center center;
  background-color: white;
  position: absolute;
  z-index: 9999;
  top: 0;
  left: 0;
  filter: alpha(Opacity=70);
  -moz-opacity: 0.7;
  opacity: 0.7;
  display: none;
}

.loadingmsg {
  position: absolute;
  text-align: center;
  height: 30px;
  width: 100%;
  top: 50%;
  margin-top: 25px;
}