Skip to main content

Questions tagged [gsap]

GSAP (GreenSock Animation Platform) is a suite of tools for scripted, high-performance HTML5 animations that work in all major browsers.

0 votes
1 answer
79 views

How do I replicate the exact animation done on flecto.io hero section

I came across https://flecto.io(use a vpn if the site doesn't open) and the site caught my attention. I want to replicate the animation in the hero section. To be more precise, that is the part where ...
Etemire Ewoma's user avatar
-2 votes
0 answers
14 views

React useGsap with scrolltrigger not updating actual width of the DOM element

/* eslint-disable @next/next/no-img-element */ "use client"; import { useLayoutEffect, useRef } from "react"; import { useGSAP } from "@gsap/react"; import { ...
Xiaohu Zheng's user avatar
0 votes
0 answers
27 views

Camera Positioning Issue: Integrating Three.js MapControls with GSAP Animation for Precise Target Locations

I’m encountering a problem while animating my 3D model using GSAP and Three.js. Specifically, the issue occurs when I pan the model - the camera doesn’t move to the intended target position correctly. ...
Nadir Shaikh's user avatar
0 votes
1 answer
37 views

gsap scrolltrigger for horizontal content

I'm really struggling with gsap. Im trying to have room-top__flex content to scroll horizontally when room-top is pinned. It's working but my issue is that i would like it to be unpinned when the last ...
Miu_19's user avatar
  • 65
0 votes
0 answers
15 views

Fusion animation with Javascript driven by scroll (GSAP)

i have this animation where the plasmid (circle thing) moves towards a row of objects (blue lipids) and i want the lipids to form a circle around the plasmid while it is passing through the row. I ...
user26412111's user avatar
4 votes
0 answers
46 views

SVG Mask Reveal Animation Not Working on iOS 16 and macOS Safari

I've created a reveal animation using an SVG mask to reveal the content of the page. The animation works perfectly on Chrome and other browsers. However, on iPhone iOS 16 and macOS Safari, the SVG is ...
10daer's user avatar
  • 41
0 votes
1 answer
49 views

gsap scrollTrigger is not being pinned during the animation

I'm really new to GSAP and my way of doing might be wrong. I've created a code pen : https://codepen.io/Emma-miu/pen/dyBYKYe GSAP settings: gsap.to(".before", { scrollTrigger: { ...
Miu_19's user avatar
  • 65
-1 votes
1 answer
35 views

How to make animation , where characters starts to be colorful when hover it [closed]

I'm working on a React project with Tailwind CSS and TypeScript and I'm looking to add a specific animation effect to the site. I have a black-and-white image featuring characters from a game. The ...
tkchvdvd's user avatar
0 votes
0 answers
30 views

GSAP SplitType Text Line Breaks

I'm using GSAP SplitType to animate text in my portfolio, but I'm encountering an issue where the text breaks onto new lines, displaying incorrectly. I've attached some screenshots to illustrate: The ...
Ethan's user avatar
  • 1
0 votes
0 answers
18 views

React animating elements with GSAP rendered via array.map()

I have a field of squares. Each square is a react component. const SquareInit = ({ isRotated, className }: SquareProps) => { const classes = clsx({ [s.square]: true, [s.rotated]: ...
Vight's user avatar
  • 35
0 votes
1 answer
31 views

Gsap Scroll Trigger Issue

I am creating a portfolio website for me. The issue is related with GSAP ScrollTrigger not working. I am trying to create a scroll trigger animation that when i move to my next section it should turn ...
Aditya Shukla's user avatar
0 votes
0 answers
19 views

GLTF + GSAP Mouse tracking memory leak?

So I successfuly animated a mouse trailing GLTF model with React Three Fiber and GSAP. The issue I have now is it becomes too demanding and glitchy after some time in fullscreen mode and immediately ...
Milos Glamocak's user avatar
0 votes
0 answers
19 views

gsap animation works wrong on mobile devices

the gsap.to acts like gsap.form on mobile devices only it works on desktop and mobile view on pc the function i use import gsap from "gsap"; import { ScrollTrigger } from "gsap/all"...
NourAldin Safwan's user avatar
-1 votes
0 answers
34 views

Lag in GSAP animation

I am using GSAP for the first time, on the loading website and create a animation, but it very laggy and jerky, can someone please help to fix this I tried to search about this, I found change opacity ...
Rohit Chauhan's user avatar
0 votes
0 answers
15 views

GSAP ScrollTrigger does'nt work after a reload

So i was trying to create my personal site and I want that the title text slides up when we scroll into it but in this code this works fine first but it does'nt work after a reload.... someone please ...
Mohit Tiwari's user avatar

15 30 50 per page
1
2 3 4 5
134