BUSCADOR |
---|
INDICE |
---|
INDICE PÁGINA ACTUAL |
---|
Tabla de Contenidos
BUSCADOR |
---|
INDICE |
---|
INDICE PÁGINA ACTUAL |
---|
De la misma manera que se han implementado las animaciones para Colecciones y Grupos, también se han implementado animaciones a nivel de frames.
Estas se habilitan definiendo los atributos animation-in y animation-out en la declaración del frame, que pueden tomar los valores siguientes:
Efectos | Valor del Atributo animation_in/out |
---|---|
Entrada/Salida desde arriba | “##PUSH_DOWN_IN##” o “##PUSH_OUT##” |
Entrada/salida desde abajo | “##PUSH_IN##” o “##PUSH_DOWN_OUT##” |
Entrada/salida por la izquierda | “##LEFT_IN##” o “##RIGHT_OUT##” |
Entrada/salida por la derecha | “##RIGHT_IN##” o “##LEFT_OUT##” |
Rotación 3D | “##ROTATE3D_IN##” o “##ROTATE3D_OUT##” |
Efecto de ZOOM | “##ZOOM_IN##” o “##ZOOM_IN##” |
Aparece/Desaparece | “##ALPHA_IN##” o “##ALPHA_OUT##” |
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##PUSH_DOWN_IN##” o “##PUSH_OUT##” |
<frame name="frmTitleCalendario" height="100%" align="center|top" width="96%" lmargin="2%" animation-in="##PUSH_DOWN_IN##" animation-out="##ROTATE3D_OUT##">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##PUSH_IN##” o “##PUSH_DOWN_OUT##” |
<frame name="frmTitleCalendario" height="100%" align="center|top" width="96%" lmargin="2%" animation-in="##PUSH_IN##" animation-out="##ROTATE3D_OUT##">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##LEFT_IN##” o “##RIGHT_OUT##” |
<frame name="frmnuevochat" animation-in-delay="250" animation-out-delay="250" animation-out="##LEFT_IN##" disablevisible="MAP_VERFLOTANTE=0" bgcolor="#ffffff" modal="true" floating="true" top="0" left="0" width="100%" height="100%">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##RIGHT_IN##” O “##LEFT_OUT##” |
<frame name="frmnuevochat" animation-in-delay="250" animation-out-delay="250" animation-in="##RIGHT_IN##" animation-out="##LEFT_OUT##" disablevisible="MAP_VERFLOTANTE=0" bgcolor="#ffffff" modal="true" floating="true" top="0" left="0" width="100%" height="100%">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##ROTATE3D_IN##” o “##ROTATE3D_OUT##“ |
<frame name="frmTitleCalendario" height="100%" width="96%" lmargin="2%" animation-in="##PUSH_IN##" animation-out="##ROTATE3D_OUT##">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | ”##ZOOM_IN##” o “##ZOOM_IN##” |
<frame name="frmTitleCalendario" height="100%" width="96%" lmargin="2%" animation-in="##ZOOM_IN##">
Atributo | Valor del atributo |
---|---|
animation_in / animation_out | “##ALPHA_IN##” o “##ALPHA_OUT##” |
<frame name="frmTitleCalendario" height="100%" width="96%" lmargin="2%" animation-in=""##ALPHA_IN##"">
Ejemplos de animaciones definidas en .css:
.FrameAnimateFromTop { animation-in-delay:500; animation-out-delay:500; /* Entra y sale por arriba. */ animation-in:##PUSH_DOWN_IN##; /* Aparece por arriba */ animation-out:##PUSH_OUT##; /* Se va por arriba */ } .FrameAnimateFromBottom { animation-in-delay:500; animation-out-delay:500; /* Entra y sale por abajo. */ animation-in:##PUSH_IN##; /* Aparece por abajo */ animation-out:##PUSH_DOWN_OUT##; /* Se va por abajo */ } .FrameAnimateFromRight { animation-in-delay:500; animation-out-delay:500; /* Entra y sale por la derecha. */ animation-in:##RIGHT_IN##; animation-out:##LEFT_OUT##; } .FrameAnimateFromLeft { animation-in-delay:500; animation-out-delay:500; /* Entra y sale por la izquierda. */ animation-in:##LEFT_IN##; animation-out:##RIGHT_OUT##; } .FrameAnimateRotate3D { animation-in-delay:500; animation-out-delay:500; /* Entra y sale rotando en 3D. */ animation-in:##ROTATE3D_IN##; animation-out:##ROTATE3D_OUT##; } .FrameAnimateAlpha { animation-in-delay:500; animation-out-delay:500; /* Aparece y desaparece;. */ animation-in:##ALPHA_IN##; animation-out:##ALPHA_OUT##; } .FrameAnimateZoom { animation-in-delay:500; animation-out-delay:500; /* ZOOM. */ animation-in:##ZOOM_IN##; animation-out:##ZOOM_OUT##; }