Smooth Scroll with Trackpad

[SumitJadhav]

Hi,

I am using Tweenmax and ScrollToPlugin for smooth scroll effect on my website.
I have used following code for same.
 

$(function() {
        var $window = $('#outerWrapper'); //Window object
        var scrollTime = 2.5; //Scroll time
        var scrollDistance = 400; //Distance. Use smaller value for shorter scroll and greater value for longer scroll    

        $window.on("mousewheel wheel DOMMouseScroll touchmove tick", function(event) {             
                event.preventDefault();
                var delta = event.originalEvent.wheelDelta / 120 || -event.originalEvent.detail / 2;

                var scrollTop = $window.scrollTop();
                var finalScroll = scrollTop - parseInt(delta * scrollDistance);

                TweenMax.to($window, scrollTime, {
                    scrollTo: {
                        y: finalScroll,
                        autoKill: true
                    },
                    ease: Power1.easeIn, //For more easing functions see https://api.greensock.com/js/com/greensock/easing/package-detail.html
                    autoKill: true,
                    overwrite: 5
                });
            
        });

    });

and it really works great on mouse wheel scroll.
I want same effect of smooth scroll when someone try to scroll website using trackpad on laptop.

Is any solution for same?
I tried with all events 
"$window.on("mousewheel wheel DOMMouseScroll touchmove tick", function(event) {   "
but this gives regular scroll while using trackpad, not smooth scroll effect.

[ZachSaucier]

Hey SumitJadhav. In general it's good to use a smooth scrolling library for this sort of thing. GSAP's official scroll plugin, ScrollTrigger, works great with them! Check out the .scrollerProxy() docs for info and demos.

 

Also we highly recommend the GSAP 3 syntax. You can learn how to migrate here: