Question

我有一个问题，一个平滑的滚动自包含jQuery function这是我想要获得的，一个简单的平滑滚动效果

// GLOBAL JS
(function($){

  var $body,
      $window,
      settings = {
        duration: 3000
      };

  // Smooth scrolling
  function smoothScrool (event) {
    var $this = $(this),
        href = $this.attr('href'),
        $target = $(href);

        if ($target.length > 0) {
          
          event.preventDefault();

          $body.animate({
            scrollTop: $target.offset().top
          }, settings.duration);
        }
  }

  function bindings (){

    // Smooth scroll function
    $('a[href^="#"]').on('click', smoothScrool);

  }

  $(document).ready(function(){
    // Variabili
    $body = $('html, body');
    $window = $(window);

    bindings();
  });

})(jQuery);

.long {
  height: 2000px;
  width: 300px;
  background-color: pink;
  }

.red {
  color: red;
  }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#hello">this goes to HELLO</a>
<a href="#hello" class="red">this is red and goes to HELLO</a>
<div class="long"></div>
<div id="hello" class="prova"> here is hello </div>

出于某种原因，我无法拥有它here。有人可以请你解释我错过了什么，链接的语法基本相同，我刚刚添加了class es和section s我认为不应该打扰脚本。

谢谢

JQuery平滑滚动在实践中不起作用

0 个答案: