导航链接不起作用（Bootsrap）

Question

I am altering a Bootstrap-based template. The original site was a single-page with the top nav links simply scrolling to the correct section of the page. I've added some a couple of other pages, and I want the navbar links to return the users to the appropriate section of the home page.

However, when I've edited the links on the other page (not the main page) refer back to the home page, the links aren't working.

I'm sure there is something in the js files that is breaking the default mode and keeping it on the home page.

The problem is that I don't know what to edit to stop this.

The homepage is http://jimbrink.org . The scrolling links work there.

The page where the links don't work is: http://jimbrink.org/articles

Here's the html for the bar:

<div class="navbar navbar-default navbar-fixed-top" role="navigation" id="navbar">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="#intro">JimBrink.org</a>
        </div>

        <div class="navbar-collapse collapse" id="navigation">

            <ul class="nav navbar-nav navbar-right">
                <li><a href="http://jimbrink.org/#intro">Intro</a>
                </li>
                <li><a href="http://jimbrink.org/#about">About</a>
                </li>
                <li><a href="http://jimbrink.org/#resources">Resources</a>
                </li>
                <li><a href="http://jimbrink.org/#impact">Impact</a>
                </li>
            </ul>
        </div>
        <!--/.nav-collapse -->

    </div>
</div>
<!-- /#navbar -->

<!-- *** NAVBAR END *** -->

Sorry for the newbie question.

UPDATE Fixed it. The #navigation tag was just for the js function that interrupted the default action when clicked. I just removed that ID and it worked.

Answer 1

When you are clicking in "About" in menu, it has as href value " http://jimbrink.org/#about " and based in JS it has to move in section with id "about". In your HTML page you don't have any section with ID "#about". You need to add to about section id about. You need to match the sections IDs with the values of menu items href value, because when you are clicking it shows a JS error and cannot scroll to the section.

Uncaught TypeError: Cannot read property 'slice' of undefined