Jump to content
GreenSock

whizzbbig

Members
  • Posts

    26
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

whizzbbig's Achievements

  1. yes thanks for the help !
  2. Sorry for the delay was making the another prismic repo for the demo here's the DemoLink Thanks for the help 🙏
  3. I've been working on a Vite Prismic project where I was trying to make a in page elements animation from one page to another I am getting this error when i try to get spans of title element of about page the spans that i am trying to animate code import GSAP from 'gsap'; import Page from '../classes/Page'; import { split } from '../utils/text'; export default class AboutPage extends Page { constructor() { super({ element: '.about', elements: { title: '.about__title', description: '.about__description', content: '.about__content', }, }); } beforeShow() { super.beforeShow(); this.elements.titleSpans = split({ element: this.elements.title, expression: '<br>', }); } show() { this.timelineIn = GSAP.timeline(); this.timelineIn.fromTo( this.element, { autoAlpha: 0, }, { autoAlpha: 1, duration: 0.4, } ); this.timelineIn.fromTo( this.elements.titleSpans, { autoAlpha: 0, opacity: 0, y: '-50%', skewY: '-10deg', }, { opacity: 1, autoAlpha: 1, duration: 0.4, y: '0%', skewY: '0deg', stagger: { amount: 0.1, }, } ); return super.show(this.timelineIn); } hide() { this.timelineOut = GSAP.timeline(); this.timelineOut.to(this.element, { autoAlpha: 0, duration: 0.4, }); return super.hide(this.timelineOut); } } beforeShow() function is making spans in that title. it is complaining about this.elements.titleSpans
  4. HI, I want to know how we can able to stretch and smear a svg object using gsap? like what i have to do in steps to achieve that kind of process? the things I wanted to animate is related to stretching and smearing typography animation content.
  5. There's a typo I not add Y after scale here { duration: 1.5, ease: 'expo.out', scaleY: 0, transformOrigin: '100% 100%', }, so by adding that fix the problem
  6. I've been trying to make my preloader move from middle not from bottom right corner and i not able to provide the codepen coz its a pretty huge project and preloade is been working from backend here's a code and video this.elements.titleSpans are the text in 3 lines this.elements.numberText is the number at the bottom of the page this.element is the preloader itself https://imgur.com/a/7GiM5HL
  7. Hi sir i tried to adapt that working and i did it now the problem is with the position and also with the timing https://codepen.io/raj-shukla/pen/GRmQBVz?editors=0010
  8. It's in jquery so its hard for me to understand how to make it float right coz am a nerd who is new in gsap.
  9. @akapowl now the only problem is that it isn't scrolling in mobile devices https://locomotive-boilerplate.vercel.app
  10. I am facing difficulties on integrating the way you able to achieve the locomotive scroll to my project codesandbox link: https://codesandbox.io/s/little-morning-4i2vb?file=/index.html
×