NarraLeaf

BlurDissolve

This transition is designed for Image elements.

Crossfade from the current image to the next one while blurring — the current image blurs out and fades, and the next image sharpens in. A dreamy transition for flashbacks / dream states.

Usage

import { BlurDissolve } from "narraleaf-react";

image.char("image1.jpg", new BlurDissolve({ duration: 800, blur: 16 }));

Public Methods

constructor

  • options: BlurDissolveOptions
    • duration: number - The duration of the transition in milliseconds
    • blur?: number - The peak blur radius applied at the crossover, in pixels. Defaults to 16.
    • easing?: TransformDefinitions.EasingDefinition - The easing function, see TransformDefinitions.EasingDefinition

On this page