Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...

takuan

ShockinglyGreen
  • Posts

    1
  • Joined

  • Last visited

About takuan

takuan's Achievements

  1. Another way to get the element is on the event passed to the click handler: <template> <section class="container"> <div class="row"> <div class="col-12"> <div class="card" v-for="card in cards" :key="card.id" @click="simpleFade"> <div class="card-inner"> <div class="card-name">{{ card.name }}</div> </div> </div> </div> </div> </section> </template> <script> import { gsap } from 'gsap'; import { CSSPlugin } from 'gsap/CSSPlugin' gsap.registerPlugin(CSSPlugin); const myCards = [ { id: 0, name: 'Prima carta', }, { id: 1, name: 'Seconda carta', }, { id: 2, name: 'Terza carta', }, { id: 3, name: 'Quarta carta', } ]; export default { name: 'TarocchiCards', data() { return { cards: myCards, }; }, methods: { simpleFade(event){ gsap.fromTo(event.target, {autoAlpha:1},{autoAlpha:0, duration: 0.35}); } }, } </script> Notice the parens are removed in the @click in the template. If you need to pass another variable, I think you need to pass the event parameter explicitly.
×