Question

问题

现有Squarespace网站上的锚点链接已停止工作：

该网页的工作方式与Firefox和IE一样，但导航链接在Chrome（v61.0.3163.100）或Opera（v48.0.2685.35）中无法使用，因为更新到最新版本。在Chrome或Opera中，链接会闪烁预定的目的地，但不会跳转到该位置。

我做了什么

Squarespace大致如此组织网站中的每个内容部分：

<div class="parallax-item" data-url-id="contact" id="yui_123456789">
    <div class="title-desc-wrapper over-image no-main-image">
        <div class="title-desc-inner" data-collection-id="3456789012">
            <div class="page-title-wrapper" id="yui_234567890">
                <h1 class="page-title">Contact</h1>
            </div>
        </div>
    </div>
    <div class="content">
    </div>
</div>

这是Squarespace网站的事实使问题复杂化。锚点的目标（例如/ #contact）不是具有该唯一ID的div，而是html属性＆quot; data-url-id =＆＃34; contact＆＃34;＆＃39;。 div id是一个自动生成的唯一标识符（这些标识符以＆＃39; yui _＆＃39;开头）。

如果我在Squarespace中手动插入代码块并添加＆＃34; <div id='contact'></div>＆＃34;该链接将在Chrome中正常启动并将跳转（无动画）到该位置。不幸的是，我无法使用Squarespace工具将该div插入页面中的适当位置或添加动画。

如果我尝试使用jQuery来追加＆＃39;或者＆＃39; prepend＆＃39;相同的＆＃34; <div id='contact'></div>＆＃34;进入适当位置的页面（直接在父div内），锚链接不起作用，这让我相信有一些Squarespace javascript运行干扰？

感谢任何帮助！

Answer 1

@TheNally我现在明白你的意思了，好吧所以我只是做了一个快速测试，jQuery追加div按预期工作 - 锚没有任何动画 - 但你现在正在追加它们的多个实例，所以它不知道在哪里指出。

我建议为每个部分.title-desc-wrapper添加一个ID，然后将Smooth Scroll代码段添加到动画中。相对较小的补充，应该阻止你，直到bug被修复。

Squarespace网站上的Chrome / Opera Anchor Link问题

1 个答案: