Как можно разместить DIV по центру экрана на jQuery?

Вопрос

В общем-то сабж.


Ответ №1

Я бы сделал отдельную функцию:

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
    return this;
}

Использовать её просто и приятно:

$(element).center();

5 комментария

  • Саня:

    чёто не работает нихера… jquery 1.7.2

  • Всё должно быть по центру:

    Вот рабочая функция

    jQuery.fn.center = function () {
    this.css({«position»: «absolute»});
    this.css({«top»: (($(window).height() — this.outerHeight()) / 2) + $(window).scrollTop() + «px»});
    this.css({«left»: (($(window).width() — this.outerWidth()) / 2) + $(window).scrollLeft() + «px»});
    return this;
    }
    $(document).ready(function() {
    $(«.element»).center();
    });

  • Oleg_S:

    А если нужно по центру вьюпорта разместить, а не всей страницы? Страница длинная, в несколько экранов. Если вверху или внизу страницы находимся, то сообщение вообще не видно будет…

  • Oleg_S:

    Извиняюсь, туплю )))

  • nnikast:

    Пройдите 1 регистрацию, сделайте 2 действия
    и получайте от 8950 рублей каждые сутки в автоматическом режиме.

    Мы гарантируем:
    - Первый заработок в течении 60 минут.
    - Стабильный доход 24 часа в сутки.
    - Поступление денег без задержек.
    - Для России, стран СНГ и Европы.
    - Без вложений и установки ПО.
    - Специально для новичков и людей без опыта.

    Более подробная информация на нашем сайте. ( http://prosto.zarplatt.ru/ )

Добавить комментарий


(обязательно)