0

我正在尝试垂直和绝对水平地修复标题。我正在使用以下代码。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link href="style.css" rel="stylesheet" type="text/css">
<script src="header_position.js" type="text/javascript"></script>
</head>

身体标签 

$(window).scroll(function(event) {
$("#headerpos").css("margin-left", 0-$(document).scrollLeft());
});



#headerpos{
position:fixed;
border-top:8px solid #8DC540;
background:#1E415B;
width:956px;
padding-bottom:7px;
margin:auto;
z-index:100;
 }

我尝试使用 class attrb indiv以及 id attrb

.header{
position:fixed;
border-top:8px solid #8DC540;
background:#1E415B;
width:956px;
padding-bottom:7px;
margin:auto;
z-index:100;
 }

也尝试通过删除margin:auto;

我从链接Position a Div "Fixed" Vertically and "Absolute" Horizo​​ntally inside a "Position:Relative" Container Div

但它不起作用，如果我去检查元素，在 Chrome 中我会看到一个错误：

未捕获的引用错误：$ 未定义（在第 1 行）

请帮忙。这很重要。

4

3 回答 3

0

如果您在 css 中使用固定定位，则不需要 js 将 div 水平居中对齐。尝试这个。

.header{
   position:fixed;
   border-top:8px solid #8DC540;
   background:#1E415B;
   width:956px;
   padding-bottom:7px;
   margin-left:-478px;
   left:50%;
   z-index:100;
}
于 2013-04-08T20:26:28.160 回答
0

您需要在页面头部包含 jQuery，如下所示：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="header_position.js" type="text/javascript"></script>

此外，请务必将您的 jQuery 包装在一个文档就绪调用中：

$(document).ready(function () {
    $(window).scroll(function (event) {
        $("#headerpos").css("margin-left", 0 - $(document).scrollLeft());
    });
});
于 2013-04-08T19:57:08.143 回答
0

如果$未定义，则需要 jQuery。只包括

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>在另一个脚本之前。

我还建议将两个script标签都放在页面底部，以使其加载更快。

于 2013-04-08T19:57:39.663 回答