Question

我正在开发的页面之一上的Google Chrome浏览器出现问题。

<li><a href="#top">Start</a></li>
   <li><a href="assets/files/Resume.pdf">Resume</a></li>
   <li><a href="#testimonials">Testimonials</a></li>
   <li><a href="#dvcontact">Contact</a></li>

我无法使页面上的内部链接正常工作。该页面不会导航到“推荐”部分或“联系”部分。为什么这行不通？

我尝试过的事情：

我尝试将sections元素包装在div周围，但这没有也工作
我开始使用#top锚来开始工作，该锚仍然受所有浏览器支持。
我尝试使用Edge和Firefox浏览器，并且在这两种浏览器上均可使用。

可以在https://www.ashutoshysingh.com/在线访问该网站。

注意：该问题专门在Chrome中发生。我已经使用Windows 10在v65和v67上进行了测试。

编辑- 4.我还尝试过运行W3C验证程序，并且页面已通过验证。

Answer 1

实际上，我观察到的是，当我们删除li周围的<a href="#testimonial">标签时，它开始起作用我建议您保留<a href=""><li>..</li></a>

但是我无法找出正确的原因，因为同一开始工作正常

Answer 2

您似乎正在使用jQuery.localScroll插件对哈希所指向的元素进行动画滚动，并且它可能会失败，因为它在内部某处会嗅探浏览器并采用旧的顶级滚动算法（其中{ {1}}滚动而不是<body>）。我建议您更新所有相关的插件/ jQuery。

<html>的工作原理仅是因为页面上没有这样的元素，因此jQuery.localScroll不会干扰并允许浏览器执行其操作。

Chrome 61将顶级滚动机制切换为使用#top，就像标准要求和其他已经遵循的浏览器一样。 https://www.chromestatus.com/feature/6386758136627200

（我确认它可以在Chrome 60上使用）

您可以了解通过更新网站依赖的编码错误的库而解决的类似情况之一- https://groups.google.com/a/chromium.org/d/msg/chromium-discuss/0j4ewHdP2Gk/Dut0CbPMAQAJ

网页上的内部链接在Chrome中不起作用

2 个答案: