jQuery滚动不起作用

jQuery scroll not working

本文关键字：不起作用 滚动 jQuery      更新时间：2023-09-26

我知道有很多关于构建jQuery滚动的链接和技巧，我让它们在JS Fiddle中工作，但由于某些原因，当我在Visual Studio中使用它时，它不起作用。我有一个单独的jQuery v1.7.2文件（我从网站上下载的），一个名为script.js的javascript文件，其中有以下代码，用于点击滚动：

 $('a').click(function () {
     $('html, body').animate({
         scrollTop: $($(this).attr('href')).offset().top
     }, 3000);
     return false;
 });

我有一个固定的导航，当你点击链接时，页面会滚动到导航后面。实际的链接就像我使用锚标签一样工作，但它并没有放松。当你在jsfiddle中使用类似的东西时http://jsfiddle.net/9SDLw/它是有效的，但当我试图在代码中使用它时，它就不起作用了。这是我的代码：

      <div class="navigation">
      <ul id="navmenu">
          <li id="mainlogo"></li>
      </ul>
         <div class="mainnav">
              <ul id="actualnav">
                    <li>
                        <a href="#topbar" rel="">Home &nbsp;&nbsp;&nbsp;&nbsp;</a>
                    </li>
                    <li>
                        <a href="#aboutushome" rel="">About Us &nbsp;&nbsp;&nbsp;&nbsp;</a>
                    </li>
                    <li>
                        <a href="#productshome" rel="">Products</a>
                    </li>
                    <li>
                        <span class="resumatics">powered by resumatics</span>
                    </li>
              </ul>
         </div>
  </div>

到目前为止，我有2个id，当你点击"主页"链接时，它会转到我放置锚代码的页面顶部：

    <div class="topbar" id="topbar"></div>

然后在下一页，我为第二个链接放置了另一个锚，这里的"关于我们"链接：

     <div class="middlebar1" id="aboutushome"></div>

因此，当页面从一个点直接转到另一个点时，链接确实起作用，但向下和向上放松页面并不起作用，这只是一个直接的机会。我在这里错过了什么？

首先确保您在测试页面中实际包含了文件（jquery和您自己的脚本）。。

然后在DOM准备好后调用您的代码（否则代码将找不到连接处理程序的链接，因为它还没有从文件中读取。）

所以

$(function(){ //this is the way to run your code at the DOM Ready event
    $('a').click(function () {
         $('html, body').animate({
             scrollTop: $($(this).attr('href')).offset().top
         }, 3000);
         return false;
     });
});
相关文章：