1

我知道有很多关于构建 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>

因此，当页面直接从一个点移动到另一个点时，链接确实有效，但是向下缓动页面和向上缓动页面不起作用，它只是一个直接的镜头。我在这里想念什么？

4

1 回答 1

1

首先确保您已经在您正在测试的页面中实际包含了文件（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;
     });

});
于 2013-06-27T13:11:26.807 回答