[Firing autoKill on ScrollToPlugin by using the scroll wheel/mouse pad]

I'm seeing the same thing as Vusa (Windows 10). Chrome and Opera fail. Firefox sometimes. Works in Edge.

 

I get the same results as Blake. Also on Win 10

 

Chrome - nothing.

FF - sporadically.

Edge - works each time.

 

Edit:

 

Windows 7 results

IE 11 seems fine

FF - worked a few times

Chrome - nothing

Would anyone happen to have an idea on how to fix the problem or what might be causing it?

 

Edit

Would it be worth implementing an example such as http://stackoverflow.com/questions/18445590/jquery-animate-stop-scrolling-when-user-scrolls-manually/18445654#18445654 to replace the function or is the function fixable? Not to be negligible is would it be my current code causing the problem?

[Firing autoKill on ScrollToPlugin by using the scroll wheel/mouse pad]

That's what's baffling to me - every time I scroll my mouse wheel (while the scrollTo tween is in-progress), it shows the alert() exactly as it should. I'm so confused. 

 

What browser/device are you testing on?

I am testing it on two devices, each running the latest version of the browsers installed. On each device, I have 3 different browsers; Internet Explorer, Mozilla Firefox and Google Chrome. For both devices. Internet Explorer works perfectly, as soon as the mouse wheel/mouse pad scrolls it alerts straight away. However on both Chrome and Firefox, you have to scroll a lot and quickly before it fires the alert. It does seem slightly more responsive on Firefox than it is on Chrome.

 

I am sorry about this. I just can't seem to get it to work properly.

[Firing autoKill on ScrollToPlugin by using the scroll wheel/mouse pad]

I'm a bit confused - autoKill already does fire when the mouse wheel is scrolling. Are you just asking how you can set up your own separate listener for that type of thing apart from GSAP? 

Unfortunately I seem to be at a loss as well. Would be able to explain how to fire the autokill with the mouse wheel/mouse pad as just scrolling does not seem to. If you look at the linked codepen when you click on the nav to start the scrolling process and then you scroll your mouse wheel/ scroll on your mouse pad, nothing seems to happen

 

Edit

I found that if you are to scroll quite a lot really quickly it does fire the Auto Kill. Is there a way to configure how much you need to scroll before it fires the Auto Kill function?

[Firing autoKill on ScrollToPlugin by using the scroll wheel/mouse pad]

Hm, how exactly can we reproduce the problem? Your code references "this.hash" but I'm not sure what that is, and in its absence your code never even attempts to call the autoKillFired() method. Did you perhaps intend to set onAutoKill:autoKillFired on the first tween too? 

 

I'm not aware of any bugs in ScrollToPlugin. 

I do apologise. I didn't realise I missed onAutoKill:autoKillFired on the first tween. That fixes what I mistakenly thought was a bug.

 

Secondly this.hash is the hash of the element which fires the scroll event. If you look at the line of the html

<a href="#"><nav id="topnav"><span>t</span></nav></a>

The href="#". This means if I used the script 

$(function () {
	$('a[href*="#"]').click(function () {
		TweenLite.to(window, 1.5, {scrollTo:{y:$(this.hash).position().top, onAutoKill:autoKillFired}, ease: Power2.easeInOut});
		return false;
	});
});

It jumps when navigating instead of scrolling smoothly. Therefore to prevent this happening I set up a quick if else statement and when href="#" it will smoothly scroll to y:0 instead of jumping to y:0.

 

Back to the original question. Do you know if there is a way to fire the autoKill if the mouse wheel/mouse pad is scrolling?

[Firing autoKill on ScrollToPlugin by using the scroll wheel/mouse pad]

Below is the function which I use to automatically scroll on my practice site when a link is clicked.

$(function () {
	$('a[href*="#"]').click(function () {
		if(this.hash != "") {
			TweenLite.to(window, 1.5, {scrollTo:{y:$(this.hash).position().top, autoKill:true}, ease: Power2.easeInOut});
		} else {
			TweenLite.to(window, 1.5, {scrollTo:{y:0, onAutoKill:autoKillFired}, ease: Power2.easeInOut});
		}
		return false;
	});
});

function autoKillFired() {
	alert("autoKill");
}

Is there a way to fire the autoKill function when the user scrolls the mouse wheel or uses a mouse pad to scroll?

 

Also I noticed that the autoKill function does not always fire when it should. For example if the user starts the scroll and then drags the scroll bar mid way through the animation, then it may or may not fire. Is this a known bug or is there a problem with my function? (This seems to occur for the browsers I have at my disposal. The latest versions of Google Chrome, Mozilla Firefox, Opera, and Internet Explorer . However when tested on codepen it seems to work all the time)

See the Pen vKOjPj by Vusa360 (@Vusa360) on CodePen