https://github.com/alibahaari/tiltjs
Hover over any element and the element tilts inward.
https://github.com/alibahaari/tiltjs
hover tilt
Last synced: 2 months ago
JSON representation
Hover over any element and the element tilts inward.
- Host: GitHub
- URL: https://github.com/alibahaari/tiltjs
- Owner: AliBahaari
- License: mit
- Created: 2018-09-21T18:01:17.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2021-02-03T16:22:46.000Z (about 5 years ago)
- Last Synced: 2024-12-29T08:12:52.370Z (about 1 year ago)
- Topics: hover, tilt
- Language: JavaScript
- Homepage: https://alibahaari.github.io/TiltJS
- Size: 199 KB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# TiltJS
By ***TiltJS***, you hover over any element and the element tilts inward. It just uses *JavaScript*.
## Add Project
Just link TiltJS to your project :
```
```
## Initializing
Then, you should initialize properties, just copy the code below and paste it after the code above.
```
Tilt({
identifier: 'div', // Element (`.E`, `#E` or `E`)
rotationInterval: 45, // Maximum degree for rotation
outRotationX: 0, // The `rotateX` property value of the element after `onMouseOut` event
outRotationY: 0, // The `rotateY` property value of the element after `onMouseOut` event
transitionIn: ['transition-timing-function', 'transition-duration'], // Transition property for `onMouseMove` event
transitionOut: ['transition-timing-function', 'transition-duration'] // Transition property for `onMouseOut` event
});
```
*Note :* All the properties above should be filled; `identifier` should be ***String***, `transitionIn`, `transitionOut` should be ***Array***; `rotationInterval`, `outRotationX`, `outRotationY` should be ***Integer***.