如何解决从 url (fullPage.js) 中删除锚点
我一直在玩 fullPage.js,但我遇到了这个我无法解决的问题。
为了链接到我的页面内的锚点,我插入了 fullPage.js FAQ 中的以下代码:
new fullpage('#fullpage',{
anchors: ['firstPage','secondPage','thirdPage']
});
它工作正常,但当我滚动浏览不同部分时,我的网址现在从
www.example.com
到 www.example.com/#secondPage
我想要做的是从 URL 中完全删除 #/secondPage
,但仅删除哈希值对我来说也足够了。
我做了一些研究,发现这在 jQuery 中都是可行的,但应该通过历史 API 来完成(我仍然不明白是什么),但我不是对 JS 非常有经验,更不用说它的库了,不知道从哪里开始。
我的问题的视频演示:
https://www.youtube.com/watch?v=17syDii2buA&ab_channel=didurd1
解决方法
使用 anchors
选项的全部目的实际上是在部分更改时在 URL 上创建锚点。这些用作“内部链接”,因此您可以使用它们来链接到页面的其他部分。
如果您不希望它们出现在 URL 中,则必须从 fullPage.js 初始化中完全删除选项 anchors
。
然后,如果您需要创建任何内部链接,则必须将 jQuery/JavaScript 与 fullPage.js 方法 moveTo
一起使用。例如:
<a href="#" class="link" data-section="2" data-slide="1">Link here</a>
<a href="#" class="link" data-section="3">Link here</a>
$('.link').click(function(){
var sectionIndex = $(this).attr('data-section');
var slideIndex = $(this).attr('data-slide') || 0;
fullpage_api.moveTo(sectionIndex,slideIndex);
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。