Jump to content
GreenSock

Juraj

LazyLoad Image with gsap fadeIn option

Moderator Tag

Recommended Posts

Hey guys,

I need a little help with. I want to redo my lazy load with a gsap animation that can replace "SRC" for "DATA-SRC" with fadeIn effect.
So the new - full-size Image will fade over the Old one.
Any help is much than appreciated. Thank you!
 

See the Pen abOyJxr by jurajmolnar (@jurajmolnar) on CodePen

Link to comment
Share on other sites

Hey Juraj. What are you having trouble with? Unfortunately we don't have the capacity to build out every request that people make in the forums but if you have a specific question or issue we're happy to help.

Link to comment
Share on other sites

Both of the below examples use GSAP and IntersectionObserver for lazy loading images. You would just need to convert them to use GSAP 3 and whatever lazyload script/approach you prefer. Each should allow for you to build upon this type of approach and refactor either within your own project.

 

See the Pen eYOpROp by ItsLefty (@ItsLefty) on CodePen

See the Pen WWqZWj by jomartinez27 (@jomartinez27) on CodePen

 

** Most of this topic is unrelated to GreenSock specifically, but hopefully one of those can provide a starting point for you to achieve your desired result.

  • Like 5
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×