Javascript 如何将浮动div保持在窗口调整的中心位置（jQuery/CSS）

在调整浏览器窗口大小时，是否有方法（不绑定window.resize事件）强制浮动DIV重新居中

为了帮助解释，我认为伪代码应该是这样的：

div.left = 50% - (div.width / 2)
div.top = 50% - (div.height / 2)

更新

我的问题已经在下面得到了回答，我想发布我的任务的最终结果-一个jQuery扩展方法，允许您将任何块元素居中-希望它也能帮助其他人

jQuery.fn.center = function() {
    var container = $(window);
    var top = -this.height() / 2;
    var left = -this.width() / 2;
    return this.css('position', 'absolute').css({ 'margin-left': left + 'px', 'margin-top': top + 'px', 'left': '50%', 'top': '50%' });
}

用法：

$('#mydiv').center();

---

尝试水平和垂直居中。它有点旧，有一些缺陷，但您应该能够从中得出一些测试代码。

如果您有一个固定大小的div，使用CSS很容易：

.keepcentered {
    position:    absolute;
    left:        50%;        /* Start with top left in the center */
    top:         50%;
    width:       200px;      /* The fixed width... */
    height:      100px;      /* ...and height */
    margin-left: -100px;     /* Shift over half the width */
    margin-top:  -50px;      /* Shift up half the height */
    border: 1px solid black; /* Just for demo */
}

---

当然，问题是固定大小的元素并不理想。

最简单的方法是使用以下CSS代码：

#floating-div {
    width: 50%;
    border: 1px solid gray;
    margin: 0 auto;
}

---

上面CSS代码的关键行是“边距：0自动”；它告诉浏览器自动设置左/右边距以保持div在页面上居中，即使在调整浏览器窗口的大小时也是如此。

我认为如果不使用

滚动

事件，您也无法做到这一点……CSS将整个内容集中在窗口中，不在当前可见区域，您必须在滚动页面上垂直调整，这也是一个问题吗？但不能使其垂直居中。请设置宽度和高度，然后尝试边距：自动；超级明星，谢谢！我在下面发布的代码中使用了它（将代码作为注释发布根本不起作用）