Question

我创建了一个小的jquery方法来垂直和水平地对齐元素：

(function ($) {
    $.fn.center = function() {
            $(this).css({
                position: 'absolute',
                left: ($(window).width() / 2) - $(this).outerWidth(true) / 2,
                top: ($(window).height() / 2) - $(this).outerHeight(true) / 2
            });

            return this;
    }
}(jQuery));

现在我能够将特定元素集中在一起：

$('div').center();

就一切而言，一切都很完美。但现在我想在window.resize上重新定位元素。

当然，我可以这样调用这个方法：

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

但我不想要这样。我想在方法中管理这个（这样我就可以正常调用该方法 - 就像我问题的第二个代码区域一样）。

我尝试过以下方法：

(function ($) {
    $.fn.center = function() {

        $( window ).resize(function() {
            $(this).css({
                position: 'absolute',
                left: ($(window).width() / 2) - $(this).outerWidth(true) / 2,
                top: ($(window).height() / 2) - $(this).outerHeight(true) / 2
            });
        });

        return this;

    }
}(jQuery));

但这不起作用。为什么？提前致谢！：）

Answer 1

现在它打了我。范围不再适用。将其更改为以下

(function ($) {
    $.fn.center = function() {
        $this = $(this);

        $( window ).resize(function() {
            $this.css({
                position: 'absolute',
                left: ($(window).width() / 2) - $this.outerWidth(true) / 2,
                top: ($(window).height() / 2) - $this.outerHeight(true) / 2
            });
        });

        return this;
    }
}(jQuery));

窗口上的调用函数在jquery方法中调整大小

1 个答案: