Jump to content


One way to explode items (example included)

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

This is an example that I tailored that uses GSAP to imitate exploding objects. It uses multiple canvases on one element but without the need to re-draw them. I understand this might not be the best solution for large objects but it works nicely with small objects and it is easy to integrate.


Please feel free to post your own solutions because honestly I think there is somewhat lack of content in the wild about canvas/DOM explosions...


example here: http://cdpn.io/FpiJw (codepen)


PS: Feel free to fork and change the explode code (please share here if you do).

PS1: Make sure you use the SlowMo easing... ;)

  • Like 4
Link to comment
Share on other sites

  • 8 months later...

hi there..

i used your code to create nice "storm" effect with TweenMax image.


you can take a look at:


See the Pen aApDq by bazooki (@bazooki) on CodePen




  • Like 4
Link to comment
Share on other sites

Nice one, really glad you liked the technique!

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.