0

大家好...
我的固定标题有问题。当我放大或调整浏览器大小时,我的标题中的某些菜单丢失/隐藏我不知道在哪里..

所以这是我的代码:

    <div id="header">
    <ul>
        <li>Menu 1</li>
        <li>Menu 2</li>
        <li>Menu 3</li>
        <li>Menu 4</li>
     </ul>
</div>

CSS:

body{
     min-height:1000px;
}
#header{
     position: fixed;
     margin:30px;
}
#header ul{
     display:block;
}
#header ul li{
     float:left;
     list-style-type:none;
     width:110px;
     text-align:center;
     line-height:30px;
     padding-bottom:3px;
     background: #ccc;
}

演示:http: //jsfiddle.net/YgvND/1/

我需要 javascript 程序来控制 css 位置。我在放大、缩小或调整浏览器大小时的目的,以便 css 标题位置将变为“绝对”。

对不起我的语言。x)
任何人都可以帮助我....
thx..

4

2 回答 2

0

我建议你使用jquery此处描述了检查结果更改的好方法

于 2012-09-26T19:02:20.720 回答
0

我不完全确定我是否理解你的问题,但我会试一试。在我看来,您希望在调整页面大小时将#header div 定位为绝对。因此,使用 jQuery 来查找窗口调整大小。

在您的情况下,这可能有点矫枉过正。一旦页面完成调整大小,这会将任何 css 更改绑定到#header div。

$(window).resize(function() {
  if (this.resizeTO) clearTimeout(this.resizeTO);
  this.resizeTO = setTimeout(function() {
      $(this).trigger('resizeEnd');
  }, 500);
});

$(window).bind('resizeEnd', function() {
  var header = $("#header");
  header.css({
      position: "absolute",
      top: "0px",
      left: "0px"
  });
});

这是一个演示

于 2012-09-26T20:23:19.787 回答