Question

我的页面顶部有一个静态栏 100px ，页面上有一个链接到页面特定部分的菜单：

HTML：

<ul class="menu">
    <li><a href="http://domain.com/#anchor1">ANCHOR 1</a></li>
    <li><a href="http://domain.com/#anchor2">ANCHOR 2</a></li>
    <li><a href="http://domain.com/#anchor3">ANCHOR 3</a></li>
</ul>

<a id="anchor1" class="anchor" name="anchor1"></a>
<h3>HEADER 1</h3>
<div>
Content 1
</div>
<a id="anchor2" class="anchor" name="anchor2"></a>
<h3>HEADER 2</h3>
<div>
Content 2
</div>
<a id="anchor3" class="anchor" name="anchor3"></a>
<h3>HEADER 3</h3>
<div>
Content 3
</div>

CSS：

.menu {
    position: fixed;
    width: 100%;
    height: 100px;
}

a.anchor {
    display: block;
    height: 100px;
    margin-top: -100px;
    visibility: hidden;
}

使用Chrome，例如，如果我在地址栏中输入 http://domain.com/#anchor2 ，则浏览器会考虑锚点偏移并滚动到所需的点。如果我在Firefox中做同样的事情，浏览器似乎忽略偏移并滚动到错误的位置。但是，一旦我进入页面，如果我点击 ANCHOR 2 菜单项，浏览器就会滚动到正确的位置。似乎Firefox在第一次加载页面时忽略了锚点偏移。

有关在Firefox中使用此功能的任何想法吗？

提前致谢

从Firefox中的地址栏命名锚点

0 个答案: