HTML实现遮罩层的方法 HTML中如何使用遮罩层

2020-04-16 21:44:51易采站长站整理

    $(‘.overlay’).css({‘height’:$(document).height(),’width’:$(document).width()});   
    $(‘.overlay’).show();   
}   
  
/**  
 * 显示Loading提示  
 */  
function showLoading() {   
    // 先显示遮罩层   
    showOverlay();   
    // Loading提示窗口居中   
    $("#loadingTip").css(‘top’,   
            (getWindowInnerHeight() – $("#loadingTip").height()) / 2 + ‘px’);   
    $("#loadingTip").css(‘left’,   
            (getWindowInnerWidth() – $("#loadingTip").width()) / 2 + ‘px’);   
               
    $("#loadingTip").show();   
    $(document).scroll(function() {   
        return false;   
    });   
}   
  
/**  
 * 隐藏Loading提示  
 */  
function hideLoading() {   
    $(‘.overlay’).hide();   
    $("#loadingTip").hide();   
    $(document).scroll(function() {   
        return true;   
    });   
}   
  
/**  
 * 模拟弹出模态窗口DIV  
 * @param innerHtml 模态窗口HTML内容  
 */  
function showModal(innerHtml) {   
    // 取得显示模拟模态窗口用DIV   
    var dialog = $(‘#modalDiv’);   
       
    // 设置内容   
    dialog.html(innerHtml);   
       
    // 模态窗口DIV窗口居中   
    dialog.css({   
        ‘top’ : (getWindowInnerHeight() – dialog.height()) / 2 + ‘px’,