Class FlipTransition


  • public class FlipTransition
    extends CachedTimelineTransition
    Animate a flip effect on the given node Port of Flip from Animate.css by Dan Eden
     @keyframes flip {
            0% {
                    transform: perspective(400px) rotateY(0);
                    animation-timing-function: ease-out;
            }
            40% {
                    transform: perspective(400px) translateZ(150px) rotateY(170deg);
                    animation-timing-function: ease-out;
            }
            50% {
                    transform: perspective(400px) translateZ(150px) rotateY(190deg) scale(1);
                    animation-timing-function: ease-in;
            }
            80% {
                    transform: perspective(400px) rotateY(360deg) scale(.95);
                    animation-timing-function: ease-in;
            }
            100% {
                    transform: perspective(400px) scale(1);
                    animation-timing-function: ease-in;
            }
     }
     
    Since:
    2.0.0
    • Constructor Detail

      • FlipTransition

        public FlipTransition​(Node node)
        Create new FlipTransition
        Parameters:
        node - The node to affect
      • FlipTransition

        public FlipTransition​(Node node,
                              Duration duration)
        Create new FlipTransition
        Parameters:
        node - The node to affect
        duration - The duration of this Transition.
        Since:
        5.0.0