我已经在SO上查看了其他页面跳转问题,但没有找到任何匹配的问题,所以我们开始。。。
我正在构建一个使用CSS3转换和一堆哈希链接的网站,而不是使用jQuery加载/转换不同的页面/元素(只是为了好玩/证明I/CSS可以)。我遇到的问题是,当我点击我的一个链接时,滚动条会莫名其妙地自动跳下大约100像素。
我不记得它一直在做这件事,所以我的CSS中可能有什么奇怪的地方。我还在顶部添加了一些<a name>
标签,试图将其拉回来,但这也不起作用。我也尝试将onclick="window.scrollTo(0,0);"
放在链接中,但也不起作用:(
任何想法/帮助都会很棒,因为每次导航到页面时都必须滚动,这真的很烦人/可用性很差。您可以在此处查看页面。
系统信息:
浏览器:Chrome 16.0.912.75,FireFox 9.0.1,Opera 11.6
操作系统:Windows 7
我不熟悉CSS3转换,所以我不完全理解您在做什么。但是:
-
我认为这种您认为不可取的行为与浏览器的本机行为有关,即根据URL中的片段标识符将元素滚动到视图中。我不确定用
<a name>
元素覆盖它是否有效,但在任何情况下,您都会在name
值前面加一个散列,从而错误地设置了这些值。E.g应该是<a name="about"></a>
而不是<a name="#about"></a>
。 -
至少出于调试目的,我会尝试添加一个
click
事件侦听器,并在其中调用preventDefault()
,看看它是否停止滚动。 -
说明你在哪个浏览器(包括操作系统和版本)中遇到问题会很有帮助。
请注意,它不仅仅是跳到一个随机的地方,而是跳到具有哈希ID的元素。(试着在你的url末尾添加#footer
)我认为如果不在JavaScript中使用preventDefault
,你就无法绕过这一点。