在这段代码中动画化我的scrollTop函数

Animate my scrollTop function in this code

本文关键字:动画 我的 scrollTop 函数 段代码 代码      更新时间:2023-09-26

我有这个函数来滚动一个div。这个函数在这一点上做了我想要它做的事情,除了一件事。我希望滚动是动画的。我如何在这段代码中实现这一点?

$(function() {
      var ele = $('#scroller');
      var scroll = 20;
      $('.scroller-btn-up').click(function() {
        // Scroll the element up    
        ele.scrollTop(ele.scrollTop() - scroll);
      });
      $('.scroller-btn-down').click(function() {
        // Scroll the element down
        ele.scrollTop(ele.scrollTop() + scroll);
      });
      $('.scroller-btn-up, .scroller-btn-down').bind({
        click: function(e) {
          // Prevent the default click action
          e.preventDefault();
        }
      });
    });
$(function() {
  var ele = $('#scroller');
  var scroll = 20;
  $('.scroller-btn-up').click(function() {
    // Scroll the element up    
    ele.animate({scrollTop : ele.scrollTop() - scroll});
  });
  $('.scroller-btn-down').click(function() {
    // Scroll the element down
    ele.animate({scrollTop : ele.scrollTop() + scroll});
  });
  $('.scroller-btn-up, .scroller-btn-down').bind({
    click: function(e) {
      // Prevent the default click action
      e.preventDefault();
    }
  });
});