Animation with Vue.js and GreenSock

What is GreenSock?

npm install gsap
import { gsap } from "gsap";
  • 1] Target: These are the objects you are animating. They can be raw objects, an array of objects, or selector texts like”.myClass”.
  • 2] vars {}: It is an object with property/value pairs that you want to animate. along with any of the optional special properties like onComplete, onUpdate, etc.
  • 3] Position: Position sets the insertion point of the tween in an animation sequence. It can be either a number or a string.
gsap.method('selector', { }, 'position');



Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Opcito Technologies

Opcito Technologies


Product engineering experts specializing in DevOps, Containers, Cloud, Automation, Blockchain, Test Engineering, & Open Source Tech