Dissapearing Elements after Timeline completes

[dtek516]

Hi,

Im trying to animate a house with "rooms".

 

on page load, the house builds itself, then (at the moment), if you click the floating top left plus sign, it will zoom the house out, open a door and reveal a room. If you then click the house icon, the idea is that the house zooms back out - door shuts- and you can make another selection.

 

Problem I'm having, is the rotateY on the door. Sometimes the entire door disappears after rotating, sometimes doesnt. I've tried fromTo, set, clearProps. Nothing is working. Am I missing something here?

 

Thanks!

See the Pen by house (@house) on CodePen

[Jonathan]

Hello dtek516 and Welcome to the GreenSock forum!

Sorry your having issues. This will be really hard to debug within the browser. Without being able to test your code live. If you can please isolate your issue so its the door only, since you have a lot of code to go through, that is not editable on the fly.

 

I'm seeing the issue being when reversing in your main.js file on Line 94 when you clearProps of transform-origin  and scale.

 

But again to better help you please create reduced codepen demo that shows your issue so we can test it live.

 

 

Thanks!

[dtek516]

Sure.

 

See the Pen eWGbMr by dtek516 (@dtek516) on CodePen

 

However, I left everything in tact, in the event that theres more code that is causing the issue, and the fact that the page as a whole is in a way dynamic

 

Hope you can still help.

[dtek516]

As I mentioned, the only real issue appears to be on lines 97-98. Once that timeline completes, the door's properties change from what I defined.