Question

我有一个垂直居中网站的功能：

    function centerWebsite(){
        $vpheight = $(window).height();
        $headerheight = $('header').height();
        $contentheight = $headerheight + $('#content').height();
        $margin = Math.floor(($vpheight - $contentheight)/2);

        $logospacing = $('#logo').css('margin-top');

        if($vpheight > ($contentheight + $logospacing)) {
            $margin = $margin - $logospacing;
        }

        $extendedmargin = $headerheight + $margin;

        $('html').height($vpheight);
        $('body').height($vpheight);
        $('header').css('padding-top', $margin);
        $('#content').css('padding-top', $extendedmargin);
        $('#gallerynav').css('padding-top', $extendedmargin);
    }

当页面准备就绪时应该调用此函数：

$(document).ready(centerWebsite());

每次调整窗口大小时我想调用相同的函数。我试着这样做：

$(window).resize(centerWebsite());

但这不起作用。对此的解决方案是：

$(window).resize(function() {
    centerWebsite();
});

我真的需要创建一个函数来调用另一个函数吗？

Answer 1

通过包括括号，您正在进行函数调用。您希望将该函数作为引用传递，在这种情况下，您应该传递变量 - 不带括号。

$(document).ready(centerWebsite);

如果您在centerwebsite()函数中添加了console.log，则会在调用$(document).ready(centerWebsite());时看到它实际上已被调用。

Answer 2

删除括号：

$(window).resize(centerWebsite);

编辑注意：请查看此问题以获取有关回调的一些信息：What are jQuery hooks and callbacks?

函数只调用，如果包含在其他函数中，则调整窗口大小

2 个答案: