Question

var wH = $(window).height();
var wW = $(window).width();
var sT = $(window).scrollTop();
var sL = $(window).scrollLeft();

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", Math.max(0, ((wH - $(this).outerHeight()) / 2) + sT) + "px");
    this.css("left", Math.max(0, ((wW - $(this).outerWidth()) / 2) + sL) + "px");
    return this;
}

$('div').center();

我尝试将div放在页面的中心，我发现一个函数可以做到这一点。

但是，当Windows重新调整大小或用户尝试放大时，此功能不会更新新位置。

当用户尝试重新调整窗口大小或放大时，无论如何都要运行此功能吗？

Answer 1

我相信jQuery resize方法应该完全符合您的要求：

$(window).resize(function () {
    $('div').center();
});

或者，您可以使用普通的DOM方法执行此操作：

window.onresize = function () { $('div').center(); };

但是，普通DOM方法将删除绑定到窗口大小调整事件的任何现有处理程序，并且在浏览器之间可能不会表现相同。

此外，您需要将这些行移动到您的函数中，以便在调用处理程序时更新它们：

var wH = $(window).height();
var wW = $(window).width();
var sT = $(window).scrollTop();
var sL = $(window).scrollLeft();

当用户尝试重新调整窗口大小时，将div放在中心并更新功能

1 个答案: