在Firefox中的地址栏中命名为锚点

我有一个页面,顶部有一个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?

提前致谢

链接地址: http://www.djcxy.com/p/89009.html

上一篇: Named anchor from the address bar in Firefox

下一篇: reference (named anchor) in markdown