Advanced Visibility Control
"AtBegin" and not "AtBegin" Versions
The methods hide and opacity immediately render the associated element invisible.
In contrast the normally recommended methods hideAtBegin and opacityAtBegin
do so at the begin of the transition. However, if no start time is set, an
transition starts immediately after start and so there often is no visual difference.
You can check out the 4 examples below and will notice that there is a difference
between hide and hideAtBegin only if startTime is set.
Examples
taccgl.a("testimg").paint().hideAtBegin().visAtEnd().to(500,500,1).start(); | RUN |
taccgl.a("testimg").paint().hide().visAtEnd().to(500,500,1).start(); | RUN |
taccgl.a("testimg").startTime(1).paint().hideAtBegin().visAtEnd().to(500,500,1).start(); | RUN |
taccgl.a("testimg").startTime(1).paint().hide().visAtEnd().to(500,500,1).start(); | RUN |
Normally the AtBegin versions are recommended, because a startTime is easily added.
Also in case the transition is cancelled, e.g. by not calling start or start or
by using stop the AtBegin do nothing as one might expect.
A useful example for hide is:
Examples
taccgl.a("testimg").startTime(1).paint().hide().showBefore().visAtEnd().to(500,500,1).start(); | RUN |
Using showBefore the image of the animated element is shown as still image before the
animation starts at second 1. Therefore it is useful to hide the HTML element right from the
begin.
"Final" Versions
The methods visFinal and opacityFinal make HTML elements visible,
not at the end of a transition, but at the end of the complete animation.
The complete animation ends when all transitions have terminated.
Often it is indeed the desired bahaviour to hide selected HTML elements during
an animation and to restore visibility afterwards and it initally works beautifully
to make these elements visible using visFinal.
However, if you want to add a permanently spinning logo to the web page, or
just permanently display a 3D object, then this solution stops working. The spinning
logo or the 3D object is for taccgl™ just a very long lasting transition
and so the animation (almost never) ends and desired visibility action never
occurs.
WebGL™ is a trademark of the Khronos Group Inc.
|