使覆盖在任何尺寸的屏幕上都处于完美的中心位置

making an overlay sit perfectly centeral on any size screen

本文关键字:完美 位置 于完美 任何尺 覆盖 屏幕      更新时间:2023-09-26

我有一个元素需要在屏幕上水平和垂直居中定位,我没有用jQuery来做这件事,但我该怎么做呢,目前我的代码是这样的,

$("dd a, dt a, .job_listings a, #similar_jobs a").live("click", function(){
    var self = $(this);
    $("#overlay").fadeIn('slow');
    var targetProcent = 68;
    var targetWidth = $(window).width() * (targetProcent / 100);
    var targetHeight = $(window).height() * (targetProcent / 100);   
    var targetX = ($(window).width() - 827) / 2;
    var targetY = 75;
    $('#lightbox').load(self.attr("href"));
    //usePointFromPostcode(document.getElementById('postcode').value, placeMarkerAtPoint)
    $('#lightbox').css({
        "position": "absolute", 
        "top": $(window)+75+"px", 
        "left": targetX+"px"
    }).fadeIn('slow');
    //$('html, body').animate({scrollTop:0}, 'slow');
    return false;
});

@udders;可能是您可以定义position :absolute给您的元素css

div{
width:300px;
height:300px;
top:50%;
left:50%;
margin-top:-150px;
margin-left:-150px;
}

margin元素height & width的一半

查看链接了解更多信息:

垂直(和水平)居中

垂直居中页面内容