Jump to content
GreenSock

Gazzawazza

Touch events with Tilt

Go to solution Solved by Jonathan,

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

Hi,
First of all GSAP rocks, loving it.
Although, I am a newbie. 

I have found a code pen which is a great feature however, could someone give a little direction on how to make this touch event and not just mouseover.

 

I have dabbled with .on('touchstart' etc

However, dabble is the best term as I could do with some guidance.
Thanks In advance.


 

See the Pen mErGgB by jimthornton (@jimthornton) on CodePen

  • Thanks 1
Link to comment
Share on other sites

  • Solution

Hello Gazzawazza, and Welcome to the GreenSock Forum!

 

This looks like a question more about how to create JS event handlers and not a question about the GSAP API.

 

You might want to look into HammerJS:

 

http://hammerjs.github.io/

http://hammerjs.github.io/recognizer-rotate/

 

Or into native touch events:

 

https://developer.mozilla.org/en-US/docs/Web/API/Touch_events

http://tutorials.jenkov.com/responsive-mobile-friendly-web-design/touch-events-in-javascript.html

 

We have to stay focused on GSAP specific API questions. But we are more than happy to help you with any questions relating to how to use GSAP or any issue with the GSAP library you may have!

 

:)

  • Like 3
Link to comment
Share on other sites

Great resources, Jonathan.

 

Gazzawazza,

 

If you have questions specific to that demo, you can reach out to the author.

Perhaps he will respond to a comment on the details page: https://codepen.io/jimthornton/details/mErGgB/

  • Like 1
Link to comment
Share on other sites

"touchstart" is just like a press, and isn't going to do much. You need to use "touchmove", and check for touches or targetTouches in the event object.

See the Pen qNJrkG?editors=0010 by osublake (@osublake) on CodePen

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.
×