Skip to content

Delay an animation until a particular event has triggered #213

@jessepinho

Description

@jessepinho

Hey @aholachek,

Freaking love this library. It's the first FLIP library I've used and it's fantastic. Thanks for your work!

My website uses react-flip-toolkit to animate the homepage images when they're clicked. Sometimes, though, that there's a brief moment when the image is blank before it fills back out again. (It's even longer on slow connections, since it's loading a higher-resolution version of the image.)

What I'd like to do (from a user's point of view) is this:

  1. When a user clicks an image, a loading spinner appears over it.
  2. When the transitioned image loads, the loading spinner disappears.
  3. Then, the animation happens, transitioning between pages.

I can't figure out, though, how to use handleEnterUpdateDelete to wait until the new image is finished loading. Is that possible? There doesn't seem to be a way to have the old and new elements of the transition "know" about each other to do something like this — especially during a route transition.

Thanks for your help!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions