Feature Request: Tilt according to device rotation on mobile

[bitofbreeze]

I would love to see this option implemented to make this more mobile-responsive. Right now, tapping on an object using tilt.js sometimes slightly changes the orientation and looks pretty bad and inconsistent on mobile, whereas allowing the device's orientation to control tilt would show the effect much better on mobile.

[Smashr]

I believe making the elements tilt on mobile devices besed on orientation/gyrospcope/accelerometer values would make this effect/library complete.

This addition would make the plugin much more usable, given that globally more than 50% of a website's traffic is from mobile devices with touch and without a 'pointer' based mouse.

Infact, parallax.js does this, and the animation effect is triggered by pointer events on desktops, and by orientation/tilt events on mobile devices. The only major difference is the type of transformation ... being "translate" for parallax.js and a "3D rotate" for tilt.js.

Try it out here:
http://matthew.wagerfield.com/parallax/

This addition, combined with the option to 'reverse' the interaction would make an already good effect great !

[enkota]

Using this in a project and was thinking the same thing! Making use of the phone's gyro would be perfect 👍

[Smashr]

Yes, given that statistically 54.32 % of all users accessing a website are from a mobile device ( tablet / phone ) without a mouse or other pointing device, it makes sense that those devices are also supported.

http://gs.statcounter.com/platform-market-share/desktop-mobile-tablet

Cheers !

[Smashr]

Also, adding native gyro support will mean that this plugin can then be used for all sorts of webapps.

[j-greig]

Love this idea, was the first think I checked on my phone after installing!

[patrykmaron]

Anyone had a chance to do this?

[justrealmilk]

👍

[TheArtOfPour]

This would be awesome!

[giovannipds]

That would be great!

[giovannipds]

https://github.com/JB1905/universal-tilt.js