I want to change the frame of the MovieClip by dragging the ball, but it's not working.

[欣華27546553d8ak]

My screen width is 800.
In the onPressMove function, I first set the range of ball's movement on the X-axis between 20 and 780.
I want to change the frame of car to 0 when the ball's position is { top: 1, right: 20, bottom: 1, left: 685.5 }, and change it to 1 when the ball's position is { top: 1, right: 114.5, bottom: 1, left: 590.15 }.

My ball can move now, but car not change the frame when ball move to the specific region.

Could anyone tell me what's wrong?

car have a lot of frame inside.

var root = this;
var ball = root.ball;
var car = root.car;

function main()
{
	createjs.Touch.enable(stage);
	stage.mouseMoveOutside = true;
	
	root.stop();

    ball.hitFrame = 1;
    ball.missFrame = 0;
    //ball.dropArea = { top: 1, right: 20, bottom: 1, left:  20 };
    ball.stopCar0 = { top: 1, right: 20, bottom: 1, left:  685.5 };
    ball.stopCar1 = { top: 1, right: 114.5, bottom: 1, left:  590.15 };
    ball.stopCar2 = { top: 1, right: 209.85, bottom: 1, left:  495.35 };
    ball.on("mousedown", onMouseDown);
}

function onMouseDown(e)
{
	var target = e.currentTarget;
	
	target.offset = { x: stage.mouseX / stage.scaleX - target.x, y: stage.mouseY / stage.scaleY - target.y };
	target.pressMoveListener = ball.on("pressmove", onPressMove);
	target.pressUpListener = ball.on("pressup", onPressUp);
}

function onPressMove(e)
{
	var target = e.currentTarget;
	
	target.x = stage.mouseX / stage.scaleX - target.offset.x;

    if (target.x < 20) {
        target.x = 20;
    } else if (target.x > 780) {
        target.x = 780;
    }
    else if (target.x > ball.stopCar0.left && target.x < ball.stopCar0.right)
	{
		root.car.gotoAndStop(0);
    }
    else if (target.x > ball.stopCar1.left && target.x < ball.stopCar1.right)
	{
		root.car.gotoAndStop(1);
    }
    else if (target.x > ball.stopCar2.left && target.x < ball.stopCar2.right)
	{
		root.car.gotoAndStop(2);
    }
}

function onPressUp(e)
{
	var target = e.currentTarget;

	target.off("pressmove", target.pressMoveListener);
	target.off("pressup", target.pressUpListener);
}

if (!root.frame0Started)
{
	main();
	root.frame0Started = true;
}

[JoãoCésar]

Hi.

You need to swap the left and right properties in the stopCar1, stopCar2 and stopCar3 objects.

And you also need to check from the smallest region to the biggest. Meaning that you have to invert the else-if chain.

Like this:

var root = this;
var ball = root.ball;
var car = root.car;

function main()
{
	createjs.Touch.enable(stage);
	stage.mouseMoveOutside = true;
	
	root.stop();

    ball.stopCar0 = { top: 1, left: 20, bottom: 1, right:  685.5 };
    ball.stopCar1 = { top: 1, left: 114.5, bottom: 1, right:  590.15 };
    ball.stopCar2 = { top: 1, left: 209.85, bottom: 1, right:  495.35 };
    ball.on("mousedown", onMouseDown);
}

function onMouseDown(e)
{
	var target = e.currentTarget;
	
	target.offset = { x: stage.mouseX / stage.scaleX - target.x, y: stage.mouseY / stage.scaleY - target.y };
	target.pressMoveListener = ball.on("pressmove", onPressMove);
	target.pressUpListener = ball.on("pressup", onPressUp);
}

function onPressMove(e)
{
	var target = e.currentTarget;
	
	target.x = stage.mouseX / stage.scaleX - target.offset.x;

    if (target.x < 20)
	{
        target.x = 20;
    }
	else if (target.x > 780)
	{
        target.x = 780;
    }

	if (target.x > ball.stopCar2.left && target.x < ball.stopCar2.right)
	{
		root.car.gotoAndStop(2);
    }
	else if (target.x > ball.stopCar1.left && target.x < ball.stopCar1.right)
	{
		root.car.gotoAndStop(1);
    }
    else if (target.x > ball.stopCar0.left && target.x < ball.stopCar0.right)
	{
		root.car.gotoAndStop(0);
    }
}

function onPressUp(e)
{
	var target = e.currentTarget;

	target.off("pressmove", target.pressMoveListener);
	target.off("pressup", target.pressUpListener);
}

if (!root.frame0Started)
{
	main();
	root.frame0Started = true;
}

I hope this helps.

Regards,

JC

[欣華27546553d8ak]

Thank you for your response and the great suggestion. I have made the correction to my error. However, unfortunately, the image still does not change with the movement of the bar.