KinesisElement
KinesisElement is a component that will react to the user's interactions.
Props
| Prop | Type | Default Value | Description |
|---|---|---|---|
| strength | Number | 10 | Strength of the motion effect |
| type | String | 'translate' | translate - translate-inv - rotate - scale - scaleX - scaleY - depth - depth-inv |
| transformOrigin | String | 'center' | Similar to the CSS transform-origin property |
| originX | Number | 50 | The motion's origin relative to the container, on the X axis. 50 being the center of the container, 0 the left side, 100 the right side. |
| originY | Number | 50 | The motion's origin relative to the container, on the Y axis. 50 being the center of the container, 0 the top side, 100 the bottom side. |
| axis | String | null | Constrain the movement to one axis. Possible values: 'x' - 'y' |
| maxX | Number | null | Limit the maximum range of the movement on the X axis |
| maxY | Number | null | Limit the maximum range of the movement on the Y axis |
| minX | Number | null | Limit the minimum range of the movement on the X axis |
| minY | Number | null | Limit the minimum range of the movement on the Y axis |
| cycles | Number | 0 | How many times the movement will repeat |