import { gsap, } from 'gsap' import { ScrollTrigger } from 'gsap/ScrollTrigger' export default { name: 'tween-animation', mounted(el: HTMLElement, binding: any) { // if(!binding.value.isGsap)return let dom = document.querySelector('body') gsap.registerPlugin(ScrollTrigger); let tl1 = gsap.timeline(); tl1.from(el,1, {y:'30px',opacity:0},) ScrollTrigger.create({ trigger: el, // 触发器元素 start: "top 90%", // 滚动触发器的起始滚动位置 end: '100% 80%', // 滚动触发器的结束滚动位置 markers: false, // 开启标注功能 animation:tl1, scroller:dom,//设置指定元素为滚动依据 scrub:2, // onUpdate:(v)=>{ // if(v.progress < 0.1){ // v.trigger?.classList.remove('active') // }else{ // v.trigger?.classList.add('active') // // v.trigger?.classList.add('active') // } // } }); }, };