加载HTML文件时,浏览器会跳转到页面中间

时间:2016-02-18 01:45:53

标签: html

当我在Chrome中打开HTML文件时,页面会在窗口顶部加载一些随机h3标记(请参阅下面代码中的最后一个h3标记),而不是页面的实际顶部。该点之上的所有内容都是加载,但我必须向上滚动才能到达顶部。

当我使用Firefox时会发生同样的事情,尽管它在窗口顶部的示例中加载了第一个h3标记。 Safari加载了"以下是粗体文本示例"顶部的段落。知道为什么会这样吗?

<h3>Audio</h3>
<audio src="07 Wake Up.mp3" controls>Here is some audio</audio>

<p>
<a href="#top">Back to top</a>
</p>

<hr />

<h3 id="B">Bold text</h3>
<p>Here is an example of <b>bold text</b></p>

<h3>Bi-directional override</h3>

<p><bdo dir="rtl">This text will go from right to left.</bdo></p>
<p><bdo dir="rtl">.tfel ot thgir morf og lliw txet sihT</bdo></p>

<h3>Blockquotes</h3>

<p>Blockquotes specify a section that is quoted from another source, like in the passage below:</p>
<blockquote cite="http://www.archives.gov/exhibits/charters/declaration_transcript.html">We hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness.</blockquote>

<h3 id="button">Buttons</h3>

2 个答案:

答案 0 :(得分:1)

如果无法看到您的代码,我猜您在某个地方尝试导航时会有一个锚标记。如果您的网址中有哈希值(#),那么可能性为99%。否则,请检查您的JS是否有随机滚动函数,该函数附加到错误的内容或者可能运行得太早。

无法看到代码,这是我最好的猜测。

答案 1 :(得分:0)

我想我知道现在发生了什么。问题不在于页面顶部加载的标签,而是自动对焦按钮显示几行:

<h4>Autofocus button</h4>
<button type="button" autofocus>Autofocus button</button>

对于任何玩自动对焦按钮的人来说,似乎它们会导致浏览器在加载时在该点上“自动对焦”(duh)。在我的原始情况下,我的页面加载了窗口底部的自动对焦按钮,顶部有几行标题,页面的实际顶部无处可见。