1

我有一个 div 在我的页面顶部充当掩码。页面本身的内容绝对以页面为中心（参见 css）。我使用 jQuery 根据#nav div 与窗口顶部的距离为 div .holder 指定一个高度。

CSS：

#pagewrap 
{
    position:absolute;
    width:915px;
    margin-left:-458px;
    padding:0;
    left:50%;
    height:100%;
    margin-top:-330px;
    top:50%;
}

.holder 
{
    background: none repeat scroll 0 0 black;
    height: 0;
    position: fixed;
    top: 0;
    width: 915px;
    z-index: 10000;
}

#nav 
{
    position:fixed;
    text-align:center;
    width:915px;
    height:224px;
    margin:0 auto;
    background:url(nav-off.png) no-repeat scroll 0 0 transparent;
    z-index:1001;
    font-family:'Cabin',sans-serif;
}

Javascript：

var t = $("#nav");
var offset = t.offset();
$(function() 
{
    $(".holder").css("height" , offset.top);
});

很简单，但是如果窗口的大小发生变化，我希望更新高度。

4

2 回答 2

2

使用jQuery resize方法来检测窗口大小的变化。

$(window).resize(reset);

function reset(){
      var t = $("#nav");
       var offset = t.offset();
         $(function() {
              $(".holder").css("height" , offset.top);     
           });
}

$(document).ready(function(){
     reset();// set on page load
});
于 2013-03-17T20:23:39.053 回答
0

将整个脚本放入一个函数中，并在 document.ready 和$(window).resize()上调用该函数

于 2013-03-17T20:24:13.717 回答