调用bootstrap在url中显示哈希链接，当用户点击页面滚动(锚)

Call bootstrap to show hash link in url, when user clicks on page-scroll(anchor)

本文关键字：滚动 用户 url bootstrap 显示 链接 哈希 调用      更新时间：2023-09-26

我使用Bootstrap和它的"page-scroll"。

页面滚动正常工作，除非当用户点击菜单项，URL不改变。

例如，当用户单击菜单项"PRODUCTS"时，我希望URL从http://dev01-www.erisata.lt/en更改为http://dev01-www.erisata.lt/en#products

有解决方案吗?

是的，这是预料之中的…这是引导滚动的默认行为。你需要用你自己的JQuery覆盖默认行为。

试试下面的JQuery代码，我已经在你的网站上测试过了。好用。

在您的scrolling-nav.js中，您的.bind()应该如下所示

//jQuery for page scrolling feature - requires jQuery Easing plugin
$(function() {
    $('a.page-scroll').bind('click', function(event) {
        var $anchor = $(this);
        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 500, 'easeInOutExpo');
        window.location.hash = this.hash; //add only this line here
        event.preventDefault();
    });
});

如果有任何疑问请告诉我

相关文章：