Hi there! I've used the flash versions of the libraries before but now I just recently moved to the js-version - exciting!!
Since I'm more of a designer than developer I like to place graphics, images etc. where they are supposed to be in a layout after they have been animated. This means that I really like to use "from" animation. But I've come to notice that this sometimes gives me some flicker of the elements where they are placed at the final "place" & not the "from" state. I have this (the timeline will have more animations) & this gives my some flicker of the bells element before it becomes "invisible":
window.onload = function()
{
var bells = document.getElementById("firtreeBells");
//create a TimelineLite instance
var tl = new TimelineLite();
tl.from(bells, 0.6, {top:"35%", autoAlpha:"0"});
tl.pause();
};
Setting the intitial css to an opacity:0; will solve this but then I have to use "to-animation" instead.
Or maybe a visible:hidden and change this at onStart..? Since in this case the initial opacity:0; is set for an image it won't necessary matter that much but I'm thinking that it certainly will matter if you are making an animation of text on a website.
Setting the opacity to zero or visible to hidden in the css for text is definitely not a good thing
from a SEO perspective...google for example will not like this... Any tips on this?
Best, Niklas