LottieFiles
0:000:00

Kostenlose Goofy Morphing Faces Animation

I currently use this animation to switch from one face to the next on hover. If you would also like to have the same functionality use this code with Lottie interactivity. LottieInteractivity.create( { player: '#faces', mode:"chain", actions: [ { state: 'autoplay', frames: [1,104], transition: 'onComplete', delay: [970], jumpTo: [2] }, { state: 'autoplay', frames: [2,104], transition: 'onComplete', }, { state: 'loop', frames: [105,239], transition: "hover", }, { state: 'autoplay', frames: [240,358], transition: 'onComplete', }, { state: 'loop', frames: [359,557], transition: "hover", }, { state: 'autoplay', frames: [558,737], transition: 'onComplete', }, { state: 'loop', frames: [738,901], transition: "hover", }, { state: 'autoplay', frames: [902,961], transition: 'onComplete', }, { state: 'autoplay', frames: [0,1], transition: 'onComplete', jumpTo: [1] } ], });

I currently use this animation to switch from one face to the next on hover. If you would also like to have the same functionality use this code with Lottie interactivity. LottieInteractivity.create( { player: '#faces', mode:"chain", actions: [ { state: 'autoplay', frames: [1,104], transition: 'onComplete', delay: [970], jumpTo: [2] }, { state: 'autoplay', frames: [2,104], transition: 'onComplete', }, { state: 'loop', frames: [105,239], transition: "hover", }, { state: 'autoplay', frames: [240,358], transition: 'onComplete', }, { state: 'loop', frames: [359,557], transition: "hover", }, { state: 'autoplay', frames: [558,737], transition: 'onComplete', }, { state: 'loop', frames: [738,901], transition: "hover", }, { state: 'autoplay', frames: [902,961], transition: 'onComplete', }, { state: 'autoplay', frames: [0,1], transition: 'onComplete', jumpTo: [1] } ], });

  • Optimiertes dotLottieEmpfohlen
    15.8 KB

    Kleinste Dateigröße mit Unterstützung für Themes, State Machines und Interaktivität.

    92% kleiner als Lottie JSON
  • dotLottie
    15.2 KB

    Komprimierte Lottie-Animation, die Theming und State Machine unterstützt.

  • Optimiertes Lottie JSON
    190.2 KB

    Optimiertes JSON-Format für schnelleres Laden mit Standard-Lottie-Unterstützung.

    5% kleiner als Lottie JSON
  • Lottie JSON
    200.7 KB

    Standard-Lottie-Animationsformat mit breiter Kompatibilität über Tools und Plattformen hinweg.

Other export formats

Interaktionen & Plugins

Alle anzeigen
figma
after-effects
framer
canva
webflow
wix

Kostenlos zu verwenden unter der Lottie Einfach Lizenz