jquery实现弹出层完美居中效果 修改版


这个是js文件:

// JavaScript Document
$(document).ready(function(){
    showDiv($("#pop"));
})

function showDiv(obj){
     $(obj).show();
     center(obj);
     $(window).scroll(function(){
      center(obj);
     });
     $(window).resize(function(){
      center(obj);
     });
}
    
function center(obj){
    var windowWidth = document.documentElement.clientWidth;   
    var windowHeight = document.documentElement.clientHeight;   
    var popupHeight = $(obj).height();   
    var popupWidth = $(obj).width();    
    $(obj).css({   
    "position": "absolute",   
    "top": (windowHeight-popupHeight)/2+$(document).scrollTop(),   
    "left": (windowWidth-popupWidth)/2   
    });
}

function deldiv(){
        $("#pop").remove();
    } //点击删除层;

全文:http://www.poluoluo.com/jzxy/201403/264802.html

在html代码中添加:

<div id="pop" style=" position:absolute;left:50%;">
    <div style=" position:absolute; right:5px; bottom:5px; width:200px; height:30px; background:#000000; color:#FF0000; text-align:center; padding-top:10px; font-weight:bold;">点击关闭</div>
    <a href="javascript:void(0);" onclick="deldiv();"><img src="123.jpg" /></a>
</div>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM