Jump to content
Search Community

Agusmac

Members
  • Posts

    1
  • Joined

  • Last visited

Agusmac's Achievements

  1. Hi, Im having this huge issue, I didnt code this but im supposed to fix it, the issue here is that sometimes (very inconsistent), the text and divs get stuck in the FromTo values, and dont show at all,i got the issue a couple times but im not able to replicate it. heres a demo:https://resilient-dragon-1b1e62.netlify.app/ The issue happens with everything under the hero, so it does not happen with the elements in view when the page loads import gsap from 'gsap' import { qs, qsa } from '~/assets/js/utils/common' export default { data() { return { a: [], } }, methods: { async st_init() { await this.$nextTick() let mm = gsap.matchMedia() document.fonts.ready.then(() => { let elems = qsa('.js-s-fade', this.$el) elems.length && elems.forEach((item) => { console.log(item) this.a.push( gsap.fromTo( item, { alpha: 0, y: '3rem', }, { alpha: 1, y: 0, duration: 1.5, ease: 'expo', scrollTrigger: { trigger: item, start: 'top bottom-=15%', }, } ) ) }) elems = qsa('.js-s-divider', this.$el) elems.length && elems.forEach((item) => { this.a.push( gsap.fromTo( item, { scaleX: 0, }, { scaleX: 1, duration: 2, ease: 'expo.inOut', scrollTrigger: { trigger: item, start: 'top bottom-=15%', }, } ) ) }) }) }, st_kill() { this.a.forEach((st) => st?.kill?.()) this.a = null }, }, }
×
×
  • Create New...