Как сохранить плавающий div по центру при изменении размера окна (jQuery / CSS)

Question

Есть ли способ (без привязки к событию window.resize) заставить плавающий DIV перецентрироваться при изменении размера окна браузера?

Чтобы помочь объяснить, я думаю, что псевдокод будет выглядеть примерно так:

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

UPDATE

На мой запрос, на который был дан ответ ниже, я хотел опубликовать окончательный результат моего квеста - метод расширения 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();

Answer 1

Это легко сделать с помощью CSS, если у вас есть div фиксированного размера:

.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 */
}

Проблема, конечно, в том, что элементы фиксированного размера не идеальны.

Answer 2

Самый простой способ - использовать следующий код CSS:

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

Ключевой строкой кода CSS выше является "margin: 0 auto;" это говорит браузеру, чтобы он автоматически устанавливал поля влево / вправо для сохранения центрированного на странице div, даже когда вы изменяете размер окна браузера.

Answer 3

Попробуйте эту небольшую статью о горизонтальном и вертикальном центрировании. Он немного староват и имеет несколько хаков, но вы должны быть в состоянии выработать некоторый тестовый код из него.