Animated mask behaves odd when ad loops

[nat...@activemediagroup.com.au]

Hey guys,

I have a banner ad that animates a div (mask) from a centre point with an image in it. So it looks like the image (train lines) are growing. (see couple images attached).

Problem is, when the ad loops the animation replays with the mask and image moving erratically... I have attached the working file. Is there an easy solution to this or do I need to redesign?

Is there a way to reset everything on loop so it plays like the first time through?

Any help would be great.

Cheers,
N

[Kent]

That looks nice. Could you share a link to the GWD author file please?

Kent

Google Web Designer team

[nat...@activemediagroup.com.au]

Hey Kent, thanks for the follow up... are you not able to open the ZIP file in GWD?

[Kent]

Cannot open a published file. You need to zip your entire project folder instead of Publish Locally to Zip.

[crea...@activemediagroup.com.au]

Hey Kent,
Thanks so much for clarifying that.

There seems to be an error loading when trying to post with an attachment so please see link below of the working file.

https://www.dropbox.com/s/7zxbug78c9uzmi7/VMO_NetworksDesigned_Billboard%20V3.zip?dl=0

When you preview this from GWD... plays out fine the first time (ignore the couple lines that don't fade out) but on loop everything gets a little weird.

Really appreciate your help.

Cheers,
N

[Kent]

Quick fix on this one: just repeat your label & loopNtimes event inside the #map-mask layer, since that has it's own timeline.

The posting error is expected (cannot attach JS files) so posting and sending a link as you've done is the best way to share GWD files.

Hope that helps,

[nat...@activemediagroup.com.au]

Hey Kent... love your work. I’ll give this a go when back in front of the computer.

And out of curiosity, first time using GWD... the setup of the file... is there anything I could do to optimise or be doing better?

Appreciate your help.

[Kent]

It looks good, and is a pretty complex design. Maybe you could group some layers into divs to make the list shorter, otherwise the animation is nice.