当前位置: 代码迷 >> Web前端 >> 页面loading影子效果
  详细解决方案

页面loading影子效果

热度:98   发布时间:2012-10-27 10:42:26.0
页面loading阴影效果
首先看效果图:


我是用jquery加载的,代码为:
$('body').append('<div id="loading" style="display:none;position:fixed !important;position:absolute;top:0;left:0;height:100%; width:100%; z-index:999; background:#000 url(//images/login-load.gif) no-repeat center center; opacity:0.6; filter:alpha(opacity=60);font-size:14px;line-height:20px;"> '+ 
    			'<p id="loading-one" style="color:#fff;position:absolute; top:50%; left:50%; margin:20px 0 0 -50px; padding:3px 10px;">Loading...</p>   '+
				'</div>');

控制显示与隐藏代码:
$("#loading").show();
$("#loading").hide();


该loading图标如图: 


  相关解决方案