jquery滚动功能无法正常工作

Question

我正在使用jquery视差滚动效果的网站主页面上工作。除滚动功能外，一切正常。我试图改变jquery编码，但我仍然无能为力。任何人都可以帮我弄清楚我的代码有什么问题。

<div class="navbar-collapse collapse">
            <ul class="nav navbar-nav navbar-right">
            <li class = "dropdown"><a href="#" class = "dropdown-toggle" data-toggle = "dropdown"><span>About Us</span><b class = "caret"></b></a>
              <ul class = "dropdown-menu">
                <li data-slide = '1'><a href = "#">Philosophy</a></li>
                <li><a href = "#">Founding Members</a></li>
                <li><a href = "#">Committee</a></li>
                <li><a href = "#">Code of Ethics</a></li>
              </ul>
            </li>
            <li data-slide='2'><a href="#">Digital Ecosystem</a></li>
            <li data-slide='3'><a href="#">Fellow & Members</a></li>
            <li data-slide='4'><a href="#">SIGs</a></li>
            <li data-slide='5'><a href="#">Local Chapters</a></li>
            <li data-slide="7"><a href="#">Events</a></li>
            <li data-slide="8"><a href="#">Our Service</a></li>
            <li>
                <a href="#" onClick="window.open('logout.php','_self','width=400,height=200,toolbar=yes, location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes, resizable=yes')">
                    <?php 
                    if (isset($_SESSION['CurrentUser'])) {
                        echo "Log Out";
                    }
                    ?>
                </a>
            </li>
            <li>
                <a href="#" onClick="window.open('login.php','_self','width=400,height=200,toolbar=yes, location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes, resizable=yes')">
                    <?php 
                    if (!isset($_SESSION['CurrentUser'])) {
                        echo "Login/Register";
                    }
                    ?>
                </a>
            </li>
            <li><a id="top-arrow" href="#top">^</a></li>
          </ul>
      </div>

这是javascript代码：

jQuery(document).ready(function ($) {
//initialise Stellar.js
$(window).stellar();
//Cache some variables
var links = $('.navigation').find('li');
slide = $('.slide');
button = $('.button');
mywindow = $(window);
htmlbody = $('html,body');

$('#myPopOver').popover();
$('#myPopOver1').popover();
$('#myPopOver2').popover();
$('#myPopOver3').popover();
$('#myPopOver4').popover();
$('#myPopOver5').popover();
$('#myPopOver6').popover();
$('#myPopOver7').popover();
$('#myPopOver8').popover();
$('#myPopOver9').popover();
$('#myPopOver10').popover();



//Setup waypoints plugin
slide.waypoint(function (event, direction) {
    //cache the variable of the data-slide attribute associated with each slide
    dataslide = $(this).attr('data-slide');
    //If the user scrolls up change the navigation link that has the same data-slide attribute as the slide to active and
    //remove the active class from the previous navigation link
    if (direction === 'down') {
        $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').prev().removeClass('active');
    }
    // else If the user scrolls down change the navigation link that has the same data-slide attribute as the slide to active and
    //remove the active class from the next navigation link
    else {
        $('.navigation li[data-slide="' + dataslide + '"]').addClass('active').next().removeClass('active');
    }
});
//waypoints doesnt detect the first slide when user scrolls back up to the top so we add this little bit of code, that removes the class
//from navigation link slide 2 and adds it to navigation link slide 1.
mywindow.scroll(function () {
    if (mywindow.scrollTop() == 0) {
        $('.navigation li[data-slide="1"]').addClass('active');
        $('.navigation li[data-slide="2"]').removeClass('active');
    }
});
//Create a function that will be passed a slide number and then will scroll to that slide using jquerys animate. The Jquery
//easing plugin is also used, so we passed in the easing method of 'easeInOutQuint' which is available throught the plugin.
function goToByScroll(dataslide) {
    htmlbody.animate({
        scrollTop: $('.slide[data-slide="' + dataslide + '"]').offset().top
    }, 2000, 'easeInOutQuint');
}
//When the user clicks on the navigation links, get the data-slide attribute value of the link and pass that variable to the goToByScroll function
links.click(function (e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
});
//When the user clicks on the button, get the get the data-slide attribute value of the button and pass that variable to the goToByScroll function
button.click(function (e) {
    e.preventDefault();
    dataslide = $(this).attr('data-slide');
    goToByScroll(dataslide);
}); });