Question

我有一个在IE中工作的命名锚情况但由于某些原因在Firefox或Chrome中无效。这组页面加载在Blogger框架集中，但在外部托管，因此我可以使用页面编码控制所有内容。

问题所在页面的链接如下： http://www.gmvemsc.org/p/vdb-index.html

如果您点击标题为＆＃34; Main Compartment＆＃34;的页面中的第一个链接，当您使用棕褐色药物盒点击第三张照片时问题就很明显了。以下是链接的代码：

<a href="epinepherine.html#pagetop"><img src="images/pouchmain2.JPG" alt="Main Compartment Contents" width="500" height="254"></a>

我刚刚在＆＃34; Epinepherine＆＃34;的身体标签内的锚。页面是这样的：

<a id="pagetop"></a>

如果您点击IE中的照片链接，您将被带到Epinepherine页面的顶部，其中指定的锚点所在的位置。如果您点击Firefox或Chrome中的照片链接，Epinepherine页面会加载，但框架集会在页面的一半左右滚动。

是否有更好的方法来加载每个页面，浏览器指向位于此框架内的内容的顶部？

Answer 1

问题是#pagetop锚在另一个框架中。它在自己的框架中滚动到顶部，但父框架保持滚动位置。

你应该尝试这样的事情：

<!-- this goes to the <head> of the <iframe> -->
<script>
// give an ID to the link, so you can do this:
document.getElementById("someID").addEventListener("click", function(e)
{
  // stop the link from opening (for now)
  e.preventDefault();

  // scroll to the top of the page
  window.scrollTo(0, 0);

  // manually open the link
  window.location = e.target.href;
});
</script>

告诉我它是否有效！

命名锚点在IE中工作但不在Firefox / Chrome中

1 个答案: