Need help with photoTilt?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

tregoning
417 Stars 26 Forks MIT License 37 Commits 2 Opened issues

Description

HTML5 clone of the photo tilt feature/gesture/ux found in Facebook's Paper app

Services available

!
?

Need anything else?

Contributors list

# 135,897
Shell
PHP
Scala
30 commits
# 86,707
HTML
CSS
Shell
cleanup
1 commit
# 150,828
automl
xgboost
Keras
Tensorf...
1 commit

Photo Tilt

HTML5 clone of the photo tilt feature/gesture/ux found in Facebook's Paper app.

Basic Usage

PhotoTilt (image url, container node)

var photoTilt = new PhotoTilt({
    url: 'photo.jpg',
    lowResUrl: 'lowRes.jpg', //optional it will load lowRes 1st if available
    maxTilt: 18, //optional, defaults to 20
    container: document.body  //optional, defaults to body
    reverseTilt: false //optional, defaults to false
});
Note: The speed of the tilt can be tweaked by updating the transform transtion speed in the CSS file.

Demo

You can find a working example here (make sure you test this on a device with a triaxial/accelerometer like a phone/tablet).

More

Blog post with extra information here.

TODO

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.