从另一个页面访问时，bootstrap scrollspy [英] Bootstrap scrollspy when accessing from another page

问题描述

我正在尝试链接到主页的特定部分，同时保持滚动间谍功能.

Im trying to link to a specific section of my home page while maintaining a scroll spy feature.

使用以下代码:

<li><a href="#sec1">About</a></li>

scrollspy正在运行，但是如果我尝试从除主页之外的其他页面访问它，则只会将"#sec1"添加到当前页面的url中，而无效.

the scrollspy is functioning but if I try to access it from a page other than my home page it just adds "#sec1" to the current page's url, to no effect.

如果我将其更改为:

<li><a href="/#sec1">About</a></li>

它带我到主页上的正确部分，但scrollspy函数不再起作用.

It takes me to the correct section on the home page, but the scrollspy function no longer works.

js代码

$(function(){/* smooth scrolling for scroll to top */
     /* highlight the top nav as scrolling occurs */
     $('body').scrollspy({ target: '#navbar' })
});

有什么想法吗?

推荐答案

您可以尝试

$(document).ready(function(){
    var href = window.location.href; 
    var splitit = (href.split('#'))[1]; //split url to get sec1 name
    if(splitit !== "" || splitit !== "undefined"){
        $('html, body').animate({
            scrollTop: $('#'+splitit).offset().top
        }, 2000);
    }
});

此代码将拆分url以获取sec1或sec2 ....，然后滚动到id ="sec1"的div

this code will split the url to get sec1 or sec2 .... and then scroll to the div with id="sec1"

我的意思是，如果您将另一个页面重定向到www.website.com/anything#sec1，它将以id ="sec1"将该页面滚动到div

I mean if you redirect another page to www.website.com/anything#sec1 it will scroll the page to the div with id="sec1"

看看这个 演示

您可以看到 Jsffidle

这篇关于从另一个页面访问时，bootstrap scrollspy的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！