jquery - jQuery动态调整元素的高度到视口

Question

我在让 jQuery 脚本正常工作时遇到了一些问题。我需要我的标题元素是我的视口的高度。问题是，除非我单击检查元素或更改我的浏览器大小，否则它不会扩大我的视口高度。我觉得很奇怪，因为它不是页面加载时视口的高度，但如果我篡改它就会变得如此。

这是我正在使用的：

    $(document).ready(function(){
        $(window).resize(function(){
        var newheight = $(window).height();      
        $("header.full-header").height(newheight);
        });
    });

Answer 1

您必须在页面加载时调用该函数一次，因为在调整窗口大小之前不会触发调整大小。

$(document).ready(function(){
    doResize(); // run once on page load
    $(window).resize(doResize); // run on every resize
});
function doResize(){
    var newheight = $(window).height();      
    $("header.full-header").height(newheight);
}

Answer 2

在函数之后再次触发 resize 事件，即：

$(window).resize(function (){
    // All your code here
    var newheight = $(window).height();      
    $("header.full-header").height(newheight);
}).resize();

现在应该可以工作了，因为您正在通过链接触发 resize onload。