在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