使用 jQuery 在屏幕上居中一个 DIV

问题描述

如何使用 jQuery 在屏幕中央设置

?

解决方案

我喜欢向 jQuery 添加函数，所以这个函数会有所帮助:

jQuery.fn.center = function () {this.css("位置","绝对");this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight())/2) +$(window).scrollTop()) + "px");this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth())/2) +$(window).scrollLeft()) + "px");返回这个；}

现在我们可以写:

$(element).center();

演示:Fiddle(添加参数)

How do I go about setting a <div> in the center of the screen using jQuery?

解决方案

I like adding functions to jQuery so this function would help:

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

Now we can just write:

$(element).center();

Demo: Fiddle (with added parameter)

这篇关于使用 jQuery 在屏幕上居中一个 DIV的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！