如何防止页面标题在窗口滚动中停止跳转

Question

我有一个固定的标题，这让我在这里谷歌了4个小时的头痛，页面开始加载时，它会从右到左略有跳跃。如何防止这种情况，并在链接单击时有固定的标题。这是我的css：

<div id="main-header" style="border: none; width: 100%; margin: auto; top: 0; z-index: 100; background-color: #9A430B;"> 
  the links are here...  
  </div>

提前感谢

这是把它放在最上面的剧本.

 <script>
 $(document).ready(function() {

var div = $('#main-header');
var start = $(div).offset().top;

$.event.add(window, "scroll", function() {
    var p = $(window).scrollTop();
    $(div).css('position',((p)>start) ? 'fixed' : 'static');
    $(div).css('top',((p)>start) ? '0px' : '');
  });

});
 </script>

但链接是从右到左的点击，页面加载，.

Answer 1

尝试此Demo css样式以进行更改。我已经给了position:fixed，如果您希望您的标题保持在固定位置，即使用户滚动页面。

您的标题可能会跳跃，因为层。也就是说，您的标题必须在html结构的顶部，就像它们出现在上面一样。我不知道你是否想要任何固定的标题。但是，如果您不希望它被固定，那么您就不需要指定任何位置，只需

width:100%;
z-index:5; //just a higher value than 1

注意：不设置floating或position:absolute，除非是必要的。此外，您不需要JavaScript为您的头设置样式，它可以很容易地用CSS维护，而不需要任何复杂性。希望我能明白这一反应。