Question

任何人都可以告诉我如何使用jQuery在用户展示窗口时使用jQuery使#mydiv坚持到窗口的整个高度。在此示例中，它仅调整页面加载的高度。每当用户展开窗口时我都需要调整它。

<html><head>
<script src="js/jquery.js"></script>    

</head><body>
<style>

#mydiv {
background-color: blue;
height: 50px;
}

</style>

<div id="mydiv"></div>  
</body></html>

<script>

    if($("#mydiv").height() < $(window).height())
{
    $("#mydiv").height($(window).height());
}  

</script>

</body>
</html>

Answer 1

        <!DOCTYPE html>  
        <html>
        <head>
            <meta http-equiv="content-type" content="text/html; charset=utf-8">
            <meta http-equiv="Content-Style-Type" content="text/css">
        <style type="text/css">
          #mydiv {
            background-color: blue;
            height: 50px;
          }

        </style>
        </head>
        <body>


        <div id="mydiv"></div>  

        <script src="js/jquery.js"></script>   
        <script>
          $(window).on('load', function(){
            $("#mydiv").height($(window).height());
            $(window).on('resize', function(){
              $("#mydiv").height($(window).height());
            });
          });

        </script>

        </body>
        </html>

Answer 2

$(function(){
    $("#mydiv").height($(window).height()); // for onload

    //for resize
    $(window).resize(function () {
        $("#mydiv").height($(window).height());
    });
});

在jQuery中：如何在用户展开窗口时更新函数

2 个答案: