Jquery Animate ScrollTop with easing plugin

Question

I have this jquery code to scroll to an element when another is clicked

$("#element1").click(function() {
        $('html, body').animate({ scrollTop: $("#element2").offset().top }, 1000);
});

Now i need to implement an easeInOutCirc easing on this movement, using the Jquery Easing Plugin http://gsgd.co.uk/sandbox/jquery/easing/

Never seem to get it right, please help

So you followed the documentation? Does it not work at all, or is there some other issue. What exactly does "get it right" mean? — adeneo, Oct 20 '16 at 19:08
Yes I followed the documentation but there no scroll. Here's what I tried: https://jsfiddle.net/a316xhxL/ — user1434010, Oct 20 '16 at 23:13

score 1 · Answer 1 · answered Mar 08 '17 at 08:07

1

  $(".scroll-top").on("click", function(e){

      e.preventDefault();

       $("html, body").animate({scrollTop:"0"},900,"easeInSine");
  });

answered Mar 08 '17 at 08:07

Rubel Hossain

2,503
2
22
23

w3spi · Answer 2 · 2016-10-20T20:33:30.367

0

Like it said in the documentation, you have to do :

$("#element1").click(function(e) {
  $('html, body').animate({
    scrollTop: $("#element2").offset().top
  },
  {
    duration: 1000,
    easing: easeInOutCirc
  });
});

edited Oct 20 '16 at 20:33

answered Oct 20 '16 at 19:18

w3spi

4,380
9
47
80

Thank you, I had tried that but without success. Here https://jsfiddle.net/a316xhxL/ – user1434010 Oct 20 '16 at 23:12

Jquery Animate ScrollTop with easing plugin

2 Answers2