Function rotateFade

  • rotateFade(
        node: HTMLElement,
        options?: {
            delay?: number;
            duration?: number;
            easing?: EasingReference;
            easingFade?: EasingReference;
            easingRotate?: EasingReference;
            end?: number;
            initial?: number;
        },
    ): TransitionConfig

  • Combines rotate & fade transitions into a single transition. For options easing this is applied to both transitions, however if provided easingRotate and / or easingFade will take precedence. The default easing is linear.

    Note: that when reversing the transition that time goes from 1 - 0, so if specific options are applied for rotating out transition then end and initial are swapped.

    Parameters

    • node: HTMLElement

      The transition node.

    • Optionaloptions: {
          delay?: number;
          duration?: number;
          easing?: EasingReference;
          easingFade?: EasingReference;
          easingRotate?: EasingReference;
          end?: number;
          initial?: number;
      }

      Optional parameters.

      • Optionaldelay?: number

        Delay in ms before start of transition.

      • Optionalduration?: number

        Total transition length in ms.

      • Optionaleasing?: EasingReference

        Easing function name or function to apply to both slide & fade transitions.

      • OptionaleasingFade?: EasingReference

        Easing function name or function to apply to the fade transition.

      • OptionaleasingRotate?: EasingReference

        Easing function name or function to apply to the rotate transition.

      • Optionalend?: number

        End rotation in degrees.

      • Optionalinitial?: number

        Initial rotation in degrees.

    Returns TransitionConfig

    Transition config.

Settings

Member Visibility