I've made a parallax website and added smooth scrolling to it with the mousewheel, and that all works fine. Though if I use the scroll bar, the background images do not move, only the image in the foreground.
What I wanted to do it replicate the same smooth scrolling that's on the mousewheel, onto the scrollbar on the right hand side.
I want to replicate the scrolling like in this site:
You'll notice that scrolling with the mousewheel is smooth, and then if you click and drag the scrollbar on the right it eases into position. Can anyone give me tips on how to do this? I know a lot of AS3 but not much JS at all, this is all kind of new to me.
This is the smooth scrolling code i'm using
$(function(){
var $window = $(".parallax"); //Window object
var scrollTime = 1.2; //Scroll time
var scrollDistance = 70; //Distance. Use smaller value for shorter scroll and greater value for longer scroll
$window.on("mousewheel DOMMouseScroll", function(event){
event.preventDefault();
var delta = event.originalEvent.wheelDelta/120 || -event.originalEvent.detail/3;
var scrollTop = $window.scrollTop();
var finalScroll = scrollTop - parseInt(delta*scrollDistance);
TweenMax.to($window, scrollTime, {
scrollTo : { y: finalScroll, autoKill:true },
ease: Power1.easeOut,
autoKill: true,
overwrite: 5
});
});
});
Smooth Scroll with Scrollbar
in GSAP
Posted
Hey everyone, I'm looking to get a bit of help.
I've made a parallax website and added smooth scrolling to it with the mousewheel, and that all works fine. Though if I use the scroll bar, the background images do not move, only the image in the foreground.
What I wanted to do it replicate the same smooth scrolling that's on the mousewheel, onto the scrollbar on the right hand side.
I want to replicate the scrolling like in this site:
http://thisisarc.com
You'll notice that scrolling with the mousewheel is smooth, and then if you click and drag the scrollbar on the right it eases into position. Can anyone give me tips on how to do this? I know a lot of AS3 but not much JS at all, this is all kind of new to me.
This is the smooth scrolling code i'm using
Thanks guys