css display:none applied to animated objects not ok?

[pfenerty]

Hi,

I have many objects in an animation to which i apply css display block-or-none, which makes them come and go. But none of those objects are animated ... they have no keyframes.

Now when i apply display:none; to an animated image ... an image that transitions from opacity zero to 100% and then back to zero ... the timeline does not complete.

By that i mean that all of the javascript in Properties -> Actions -> Start runs, but none of the javascript in Properties -> Actions -> End does. The timeline hangs.

The problem goes away when i delete the object's keyframes, so that's pretty convincing.

It seems like if i set keyframes in the Animator, periodically hiding the object with display:none; is not an option. I can get one or the other, but not both.

Alternatively I suppose i could modulate the opacity in javascript with timers when i want the object to be visible ... roll my own keyframes ... and set display:none; in an else clause when i don't. One or the other, but not both.

Or maybe move the object offscreen in javascript when i want it to go away?

Any better ideas?

Thanks!
-Paul

[pfenerty]

Turns out that moving the object about is not a bad way to go. Took some serious tweaking to get the positions right:

controller.getElementById('flash-image').style.left="-505px";  
controller.getElementById('image-box').style.left="-558px";

... but then that's why they pay me the big bucks.