stop()

Stop all animations on the object.

Description

Stop all animations on the object. This will clear all the animations from the queue for this object, without setting any end values.

Return Value

displayObject. Returns the display object itself.

Examples

Example 1

We create a new core instance and a rectangle that we add to the canvas. Then we bind an event handler to the rectangle, which will change the fill color to green when clicked. It will also clear the animation queue and start an animation, that will rotate the rectangle 360 degrees. With the callback we specify that the fill color should be red when the animation is complete. The stop() method makes the result a bit more expected than it would be without (see the example of the animate() method). Try clicking on the rectangle while it is animating.

var canvas = oCanvas.create({
	canvas: "#canvas",
	background: "#ccc",
	fps: 60
});

var rectangle = canvas.display.rectangle({
	x: 177,
	y: 200,
	origin: { x: "center", y: "center" },
	width: 200,
	height: 100,
	fill: "#000"
});

canvas.addChild(rectangle);

rectangle.bind("click tap", function () {
	this.fill = "#0f0";
	canvas.redraw();

	this.stop().animate({
		rotation: this.rotation + 360
	}, {
		duration: "long",
		easing: "ease-in-out-cubic",
		callback: function () {
			this.fill = "#f00";
			canvas.redraw();
		}
	});
});