HTML5 Canvas Code Error

[Roadbobek]

I coded it so that when the button is clicked it goes to frame 2 and plays the animation, but when i test it goes to frame 4 instead? How can i fix.

This is my first time using HTML5 Canvas and just a quick demo so please excuse the bad quality.

[Roadbobek]

I coded the same thing just with a different button, so when I press the button the animation should go to frame 20 but instead, it goes to frame 22. Same problem!

[Roadbobek]

To clarify when I said "when the button is clicked it goes to frame 2" "it" is referring to the animation.

[JoãoCésar]

Hi.

In the HTML5 Canvas document, the first frame is 0. So when you use gotoAndPlay(2), you're actually sending the timeline to the third frame. So you should use gotoAndPlay(1) to send to the second frame.

Also, the click event listener is being readded everytime that frame is revisited. Thus you should add a check to prevent it. For example:

var _this = this;

if (!_this.frame0Started) // frame0Started is just a custom property
{
	_this.button_1.on("click", function()
	{
		_this.gotoAndPlay(1);
	});

	_this.frame0Started = true;
}

I hope this helps.

Regards,

JC

[Roadbobek]

I copy and pasted the code you suggested and it went from being offset by 2 frames to 1 frame. I changed the start frame to 0 and it works well. But when I tried copying the code for another animation everything broke.

[kglad]

create a new fla that allows you to simplify and test the problem you're seeing, so it's easier to understand what you're doing incorrectly.

[kglad]

if you fail to account for the way canvas counts frames, you'll be off by 1 frame, not 2 frames.  are you sure it's off by 2, and not 1?

[Roadbobek]

Im sure

[kglad]

Im sure

By Roadbobek

meaning?

[Roadbobek]

I'm sure it's off my 2 frames.

[kglad]

you created a test fla and something there is "off by 2 frames"?

if so, exactly what did you create in your test fla?

[Roadbobek]

It's just schoolwork, I attached 2 videos earlier.

[kglad]

trying to understand your error in anything other than a simple fla is often difficult. 

so again, create a new test fla with the bare minimum to display the problem you're having.  ie, a few keyframe with different content on stage that shows which frame is on stage and one of two button goto's.