javascript - 带有跳转链接的网页

Question

我是网络开发领域的新手，请原谅我在某些方面的无知:p

谁能说出跳转链接是如何工作的？以及如何实现它们？

让我举一个具体的例子，我想创建一个带有水平栏的网站，我看到一些现代网站，这些链接不会改变页面，它们只是跳到另一个部分，如果我向上滚动，我又回到家了。

我如何实现它以及它是否与 bootstap 一起工作？

谢谢

Answer 1

我的 friend ，那是一个单页网站，它们不是跳转链接，您只是使用 jquery 向下滚动到点击时的内容。

下面是一个代码示例:

$(function() {
    $("#abc").bind("click", function() {
        $("html, body").animate({
            scrollTop: $("#anchor").offset().top
        }, 500);
    });
})(jQuery);

当您点击一个 id 为 abc 的元素时，无论它位于页面的哪个位置，它都会将您带到#anchor id 元素的顶部。

另外，这里有一个使用这个确切代码的例子:jsfiddle