Jump to content
Search Community

afxreindl

Members
  • Posts

    1
  • Joined

  • Last visited

afxreindl's Achievements

1

Reputation

  1. Hi did someone ever solved this for GSAP3 in Vue.js ? Here is a demo solution that works: <template> <div> <object id="svgObject" type="image/svg+xml" :data="svg"></object> </div> </template> <script> import gsap from 'gsap' export default { data() { return { svg: require('@/assets/simple_opt.svg'), } }, mounted() { // if (this.blink) { // this.doBlink() // } window.addEventListener('load', function() { // here is the Vue code var svgObject = document.getElementById('svgObject'), svgDoc = svgObject.contentDocument, // select child elements like this : svgChild = svgDoc.getElementById('path') /* / ANIMATION */ // MOVEMENT gsap.to(svgChild, { duration: 3, opacity: 0, xPercent: -30, yPercent: 8, ease: 'power2.InOut', repeat: 0, }) /* END ANIMATION */ }) }, methods: {}, } </script> Cheers Anton
×
×
  • Create New...