Jump to content
Search Community

Breci

Members
  • Posts

    3
  • Joined

  • Last visited

Everything posted by Breci

  1. @elegantseagulls I noticed the gsap.timeline() syntax, but I'd like to avoid importing all gsap to be able to do some tree-shaking for the final bundle. Is there a way?
  2. Looks like the problem was indeed from the tree-shaking of the last version of Storybook. After adding the line you mentioned it is now working. Thank you @GreenSock For the animation, I want to assign the position absolute and opacity 0 , wait 0.5seconds, then remove the absolute position and do the rest of the animation. I'm working with Vuejs transition-group, so I'm waiting for the other components to be hidden from the list (not visible and not taking any width) before displaying the new ones. How would you chain that?
  3. Hello, I started using GSAP to do animations with VueJS. Locally everything works, but when I build my Storybook and upload it, GSAP simply doesn't work anymore GSAP version: 3.2.6 Here is the console Live demo for the fade animation: http://breci.io/demo_bug/?path=/docs/components-ui-pagination--basic#with-animation Here is the code used for the fade animation (other animations use a similar structure): import { TimelineLite } from "gsap"; const ANIMATION_DURATION = 0.5; export default { enter(el, done) { const timeline = new TimelineLite(); timeline .fromTo( el, { position: "absolute", opacity: 0 }, { position: "absolute", duration: 0.5 } ) .set(el, { position: "unset", clearProps: "position" }) .to(el, { duration: ANIMATION_DURATION, opacity: 1 }) .eventCallback("onComplete", done); }, leave(el, done) { const timeline = new TimelineLite(); timeline .to(el, { duration: ANIMATION_DURATION, opacity: 0 }) .eventCallback("onComplete", done); } }; I assume it can be linked to the build process, anyone got a similar problem before?
×
×
  • Create New...