基于浏览器视口的内容高度

Content Height Based On Browser Viewport

本文关键字:高度 视口 浏览器      更新时间:2023-09-26

我有一些使用JQuery的Javascript,如果我的主要内容的容器小于浏览器的视口,它会给它一个高度。这是为了确保页脚始终位于页面的底部。温,我这样称呼它,它有效:

$(document).ready(function() {
    var windowHeight = $(window).height();
    var contentHeight = windowHeight - 325;
    if($("#content").height() <= contentHeight) {
        alert(contentHeight);
        $("#content").height(contentHeight+"px");
    }
});

但我想把它声明为一个函数,这样我就可以在页面调整事件中使用它,但当我这样做时,它就不起作用了。这是我尝试使用的代码:

function pageSizer() {
    var windowHeight = $(window).height();
    var contentHeight = windowHeight - 325;
    if($("#content").height() <= contentHeight) {
        alert(contentHeight);
        $("#content").height(contentHeight+"px");
    }
}
$(document).ready(pageSizer());
$(window).resize(pageSizer());

有什么想法吗?

$(document).ready(pageSizer());
$(window).resize(pageSizer());

更改为

$(document).ready(pageSizer);
$(window).resize(pageSizer);

您正在调用您的函数,而不是将它们作为jQuery所期望的引用来传递。