Jump to content


collision detection

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

What is the code for collision detection in this pen?

Between the rect and the wall?

I have tried several things but I cant find it.

Btn on.mousedown => rect goes down


See the Pen EpJbvQ by makis2404 (@makis2404) on CodePen

Link to comment
Share on other sites

Hey @makis2404


With GSAP you can use Draggable's hitTest method to perform the hit test. On codepen under each panel there is option under drop down, called 'tidy'. It makes your code far more readable and neat, give it a try.


See the Pen xJepQx?editors=1010 by Sahil89 (@Sahil89) on CodePen


I see you are having fun with small games etc. I would recommend a book you will enjoy learning from. All examples are for Canvas but you can apply same logic for the HTML elements.




All the examples from book can be found here: http://lamberta.github.io/html5-animation/


Checkout the video by author of original book,



  • Like 5
Link to comment
Share on other sites

Hello Sahil!

The book you told me its great!

I have to thank you!

I am reading slowly and for the firs time I can tell that I can understand some things about small games!

I have made a new pen!

If you know any other book about small games (javascript) I would be thankfull to tell me about!


See the Pen QVLjjV by makis2404 (@makis2404) on CodePen

  • Like 1
Link to comment
Share on other sites

Yup it is fun book to learn from, good to see you are enjoying it.


I am not aware of any game development related book to recommend. @OSUblake can suggest for sure, he was the one who introduced me to that book. In the mean time take a look at following thread that might interest you.



  • Like 4
Link to comment
Share on other sites

On 8/18/2018 at 4:47 PM, PointC said:

A couple I'd recommend:


Advanced Game Design

Foundation Game Design


Happy tweening.





I have both of those books. My Foundation Game Design book has some weird printing errors, but it's still a good book. The author of that book has a book about PixiJS, which is commonly used with games.



And he maintains a couple game engines.




But Phaser is the most popular 2D game engine.



Also check out the HTML5 Game Devs forum



GSAP should play nicely with all those engines/libraries.

  • Like 7
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.