Make a mask follow cursor / mouse movement

[brainfruit]

I'm creating a little game where the user moves their mouse to reveal a scene inside a building - they need to find an object. To do this, I'm creating a group of animated objects that comprise the contents of the house, and masking them with a circle. When the user moves their mouse, they 'reveal' the contents of the house.

The problem I am having is that I can't find a way to make the mask 'stick' to the mouse cursor. All the tutorials I find are either unsuited to the problem or aimed at edge animate or flash.

Can anyone help to solve the problem? I have a feeling it's really simple and I'm not seeing the solution

Thanks!

[Colin Holgate]

If this is AS3 you would have a line of code that sets the mask again. Here's a tutorial on how to set the mask with code:

AS3 Masking

[brainfruit]

Thank you for the reply. I should have specified - it's html5 canvas rather than AS3

[Colin Holgate]

I can't find a way to do dynamic masks in html5 canvas, but you might be able to get the same effect by leaving the mask where it is and moving the masked content underneath it. Then, put all of that into another movieclip, which you move in the other direction, to keep the mask under the cursor.

[brainfruit]

That is too complex for me to get my head round. I've seen a working example of what I want to do here: The Lost Sloth | Animade

It seems like such a simple problem and seems so weird that no one has tried the same thing.

[garryg86422239]

Hi there brainfruit, 

I am obsolutely new to Animate and I think that this is advanced stuff. Did you solve the problem, and is your mask now following the cursor? Would you send the exact Code, of what I have to type into Animate? That would be a huge help.
Thank you