如何使jQuery scrollLeft更平滑

Question

我是JQuery的新手。我想知道是否可以以某种方式更改以下代码，以便启用更流畅的滚动。代码有效，但我希望滚动更像滑动

       $(document).ready(function(){
        $("div.left").click(function(){
          let pos = parseFloat($("div.icon_bar").scrollLeft()) + 55;
          $("div").scrollLeft(pos);
        });
      });

Answer 1

您可以尝试jQuery动画：

$(document).on('click', 'div.left', function (event) {
    event.preventDefault();
    $('div.icon_bar').animate({
        scrollLeft: $("div.icon_bar").offset().left + 55;
    }, 500);
});

否则，您可以尝试使用CSS scroll-behavior：

div.icon_bar {
  scroll-behavior: smooth;
}

Answer 2

      'right' is the id of the button I click to scroll. 'icon_bar' is the id of the div that I have the horizontal scrollbar attached to. This worked for me. Hope it helps someone. 

      $(function() { $("#right").on('click', function() {


            $("#icon_bar").animate({ scrollLeft: "50px" }, 900);


       });

       });