Setting y limits for mousewheel scroll of a movieclip (html5 canvas)

Question

I have created a mousewheel scroll for a movieclip to move in the y direction, however I want it to stop at the bottom and top of the movieclip. Currently, it just scrolls forever. This is html5 canvas

-------------------------------

My script is:

canvas.addEventListener("mousewheel", scrollMC.bind(this));

function scrollMC(event) {

if (event.wheelDelta < 0 || event.detail < 0 ) {
this.myMovieclip.y-=20;
}
else if (event.wheelDelta > 0 || event.detail > 0 ) {
this.myMovieclip.y+=20;
}

}

-----------------------

Thank you for your help!

JoãoCésar17023019 · Accepted Answer

Hi.

What I like to do is to create a custom clamp method. Like this:

canvas.addEventListener("mousewheel", scrollMC.bind(this));

function scrollMC(event)
{
	if (event.wheelDelta < 0 || event.detail < 0)
	{
		this.myMovieclip.y = clamp(this.myMovieclip.y - 20, 100, 300);
	}
	else if (event.wheelDelta > 0 || event.detail > 0)
	{
		this.myMovieclip.y = clamp(this.myMovieclip.y + 20, 100, 300);
	}
}

function clamp(value, min, max)
{
	if (value < min)
		return min;
	
	if (value > max)
		return max;
	
	return value;
}

I hope this helps.

Regards,

JC

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded