NarraLeaf

FadeIn

This transition is designed for Image elements.

Fade in from the current image to the next image.
The next image will fade in, optionally travelling in from a pixel offset.

Usage

import { FadeIn } from "narraleaf-react";

image.char("image1.jpg", new FadeIn({ duration: 3000 }));

// Fade in while drifting into place from 50 pixels away
image.char("image1.jpg", new FadeIn({ duration: 600, offset: [50, 50] }));

Public Methods

constructor

  • options: FadeInOptions
    • duration: number - The duration of the transition in milliseconds
    • offset?: [xOffset: number, yOffset: number] - The pixel offset the next image travels in from, default is [0, 0]. For example, [50, 50] will start the image 50 pixels to the right and 50 pixels up (following the story's coordinate origin).
    • easing?: TransformDefinitions.EasingDefinition - The easing function, see TransformDefinitions.EasingDefinition

On this page