zoukankan      html  css  js  c++  java
  • 页面加载中效果实现

    1、加载的loading.css

    @charset "UTF-8";
    /* LOGIN CSS */
    
    .background { 
    	display: block; 
    	 100%; 
    	height: 100%; 
    	opacity: 0.4; 
    	filter: alpha(opacity=40); 
    	background:#f1f1f1;
    	position: fixed; 
    	top: 0; 
    	left: 0; 
    	z-index: 10000; 
    } 
    .progressBar { 
    	background: white url(../img/loading.gif) no-repeat 10px 10px; 
    } 
    .progressBar { 
    	display: block; 
    	 148px; 
    	height: 28px; 
    	position: fixed; 
    	top: 50%; 
    	left: 50%; 
    	margin-left: -74px; 
    	margin-top: -14px; 
    	padding: 10px 10px 10px 50px; 
    	text-align: left; 
    	line-height: 27px; 
    	font-weight: bold; 
    	position: absolute; 
    	z-index: 10001; 
    } 

       注意:background部分的position: fixed;否则,只能在当前区域内遮盖

    2、页面引用

    <!-- shade div start -->
    	<div id="background" class="background" style="display: none; "></div> 
    	<div id="progressBar" class="progressBar" style="display: none; ">Loading...</div> 
    <!-- shade div end -->

    3、遮罩的显示与隐藏

    //遮罩效果显示
    $("#background,#progressBar").show();
    //遮罩效果隐藏
    $("#background,#progressBar").hide();
    

      

    人生苦短,我用python
  • 相关阅读:
    (图论)树的直径
    HDU 4607
    类属性的增删改查
    python内置常用模块
    字典的使用
    元组的使用
    列表的基本函数
    字符串练习题
    python3.7字符串基本函数
    python简单的while语句和if语句的练习
  • 原文地址:https://www.cnblogs.com/pigga/p/10098305.html
Copyright © 2011-2022 走看看