Glow Effect while Mouseover

[dcpust]

Hello,

I am struggling with creating an effect on an object. It is supposed to glow while the mouse is hovering over it. Below is the code I was able to produce, but it is not properly working and I am running out of ideas (as well as google results to this issue) what the remedy to the problem is.

stage.enableMouseOver(30);
var _this = this;
this.bug.addEventListener('mouseover', function(){
	var glow = new createjs.Shadow("rgba(255,0,0,1)", 0, 10, 20);
	_this.bug.shadow = [glow];
	_this.bug.cache(0,0,222,248);
	
});
this.bug.addEventListener('mouseout', function(){
	var glow = new createjs.Shadow("rgba(0,0,0,1)", 1, 0, 1);
	_this.bug.shadow = [glow];
	_this.bug.cache(0,0,222,248);
});

 Thank you for any help in advance.

[Vladin M. Mitov · Accepted solution]

Hi, 

You need to use the event's target in the event handler functions:

stage.enableMouseOver(30);


this.circle.addEventListener('mouseover', function( obj ){
	obj.target.shadow = new createjs.Shadow("rgba(255,0,0,1)", 0, 0, 20 );
});
this.circle.addEventListener('mouseout', function( obj ){
	obj.target.shadow = null;
});

Here is a working example:

https://cloud.vectorworks.net/links/11e9da0bffa1b992905d0e7947a8ce60/

[dcpust]

You're the man! It worked. Thanks a lot

[ClayUUID]

Be aware that filter effects in Canvas documents can be very slow, because they're implemented in runtime JavaScript code instead of natively supported by the browser.