html自定义二维码分享弹窗

html页面代码：

//弹窗体
<div id="popupContact"> 
    <a id="popupContactClose">X</a>  
    <h3>关注公众号,及时获取缴费信息通知</h2>
    <h4>(长按下方二维码识别关注)</h4>  
    <img src="./gzh.jpg" width="100%" height="85%">
</div>
//弹窗阴影部分
<div id="backgroundPopup"></div>  

css样式代码：

#backgroundPopup{
           display: none;
           position: fixed;
           _position: absolute;
           height: 100%;
           width: 100%;
           top: 0;
           left: 0;
           background: #cccccc;
           border: 1px solid #cecece;
           z-index: 1;
       }
    #popupContact{
           display: none;
           position: fixed;
           _position: absolute;
           height: 345px;
           width: 270px;
           background:#ffffff;
           border: 2px solid #cecece;
           z-index: 2;
           padding: 12px;
           font-size: 13px;
       }   

    #popupContact h3{
           text-align: left;
           color: rgb(46, 139, 3);
        
       }
       #popupContact h4{
           text-align: left;
           color: rgb(209, 32, 32);
           
           font-weight: 700;
           border-bottom: 1px dotted #D3D3D3;
           padding-bottom: 2px;
          
       }
    #popupContactClose{
           font-size: 14px;
           line-height: 14px;
           right: 6px;
           top: 4px;
           position: absolute;
           color: #6fa5fd;
           font-weight: 700;
           display: block;
    }

js调用部分：

//初始化：是否开启DIV弹出窗口功能
//0 表示开启; 1 表示不开启;
var popupStatus = 0;
window.onload = function() {
    showFollow();
}
//初始化：是否开启DIV弹出窗口功能
//0 表示开启; 1 表示不开启;
var popupStatus = 0;
function showFollow(){
                //调用函数居中窗口
                centerPopup();   
                //调用函数加载窗口
                loadPopup();   
}
//使用Jquery加载弹窗 
function loadPopup(){   
    //仅在开启标志popupStatus为0的情况下加载  
    if(popupStatus==0){   
        $("#backgroundPopup").css({   
        "opacity": "0.7"  
    });   
    $("#backgroundPopup").fadeIn("fast");   
    $("#popupContact").fadeIn("fast");   
    popupStatus = 1;   
    }   
}  
//使用Jquery去除弹窗效果 
function disablePopup(){   
    //仅在开启标志popupStatus为1的情况下去除
    if(popupStatus==1){   
        $("#backgroundPopup").fadeOut("fast");   
        $("#popupContact").fadeOut("fast");   
        popupStatus = 0;   
    }   
}  
function centerPopup(){   
    //获取系统变量
    var windowWidth = document.documentElement.clientWidth;   
    var windowHeight = document.documentElement.clientHeight;   
    var popupHeight = $("#popupContact").height();   
    var popupWidth = $("#popupContact").width();   
    //居中设置   
    $("#popupContact").css({   
        "position": "absolute",   
        // "top": windowHeight/2-popupHeight/2,   
        // "left": windowWidth/2-popupWidth/2   
        "top": windowHeight/5,   
        "left": windowWidth/15   
        // "top": 100,   
        // "left": 50   
    });   
    //以下代码仅在IE6下有效  
    $("#backgroundPopup").css({   
        "height": windowHeight   
    });   
}
$(document).ready(function(){   
    //执行触发事件的代码区域  
    //关闭弹出窗口   
    //点击"X"所触发的事件

    $("#popupContactClose").click(function(){   
        disablePopup();   
    });   

    //点击窗口以外背景所触发的关闭窗口事件!
    $("#backgroundPopup").click(function(){   
        disablePopup();   
    });   
});