Skip to content

Commit ed750af

Browse files
jscottsmithjscottsmith
committed
organize parallax prop docs
1 parent bc692ba commit ed750af

File tree

1 file changed

+28
-21
lines changed

1 file changed

+28
-21
lines changed

‎docs/parallax-component.md

Lines changed: 28 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -48,27 +48,34 @@ All props for creating effects are defined by a _start_ and _end_ value represen
4848

4949
The following are all props that can be passed to the `<Parallax>` component:
5050

51-
| Name | Type | Default | Description |
52-
| -------------- | :----------------------: | :------ | ------------------------------------------------------------------------------------------------------------------------------------------------------- |
53-
| **speed** | `number` | | A value representing the elements scroll speed. If less than zero scroll will appear slower. If greater than zero scroll will appear faster. |
54-
| **translateX** | `string[]` or `number[]` | | Start and end translation on x-axis in `%` or `px`. If no unit is passed percent is assumed. Percent is based on the elements width. |
55-
| **translateY** | `string[]` or `number[]` | | Start and end translation on y-axis in `%` or `px`. If no unit is passed percent is assumed. Percent is based on the elements height. |
56-
| **rotate** | `string[]` or `number[]` | | Start and end rotation on z-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
57-
| **rotateX** | `string[]` or `number[]` | | Start and end rotation on x-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
58-
| **rotateY** | `string[]` or `number[]` | | Start and end rotation on y-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
59-
| **rotateZ** | `string[]` or `number[]` | | Start and end rotation on z-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
60-
| **scale** | `number[]` | | Start and end scale on x-axis and y-axis. |
61-
| **scaleX** | `number[]` | | Start and end scale on x-axis. |
62-
| **scaleY** | `number[]` | | Start and end scale on y-axis. |
63-
| **scaleZ** | `number[]` | | Start and end scale on z-axis. |
64-
| **opacity** | `number[]` | | Start and end opacity value. |
65-
| **easing** | `string` or `number[]` | | String representing an [easing preset](#easing-preset) or array of params to supply to a [cubic bezier easing function](#cubic-bezier-easing-function). |
66-
| **className** | `string` | | Optionally pass additional class names to be added to the outermost parallax element. |
67-
| **disabled** | `boolean` | `false` | Disables parallax effects on individual elements when `true`. |
68-
| **styleInner** | `object` | | Optionally pass a style object to be added to the innermost parallax element. |
69-
| **styleOuter** | `object` | | Optionally pass a style object to be added to the outermost parallax element. |
70-
| **tagInner** | `string` | `div` | Optionally pass an element tag name to be applied to the innermost parallax element. |
71-
| **tagOuter** | `string` | `div` | Optionally pass an element tag name to be applied to the outermost parallax element. |
51+
### Props: Configuration
52+
53+
| Name | Type | Default | Description |
54+
| -------------- | :--------------------: | :------ | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
55+
| **speed** | `number` | | A value representing the elements scroll speed. If less than zero scroll will appear slower. If greater than zero scroll will appear faster. |
56+
| **easing** | `string` or `number[]` | | String representing an [easing preset](#easing-presets) or array of params to supply to a [cubic bezier easing function](#cubic-bezier-easing-function). |
57+
| **className** | `string` | | Optionally pass additional class names to be added to the outermost parallax element. |
58+
| **disabled** | `boolean` | `false` | Disables parallax effects on individual elements when `true`. |
59+
| **styleInner** | `object` | | Optionally pass a style object to be added to the innermost parallax element. |
60+
| **styleOuter** | `object` | | Optionally pass a style object to be added to the outermost parallax element. |
61+
| **tagInner** | `string` | `div` | Optionally pass an element tag name to be applied to the innermost parallax element. |
62+
| **tagOuter** | `string` | `div` | Optionally pass an element tag name to be applied to the outermost parallax element. |
63+
64+
### Props: CSS Effects
65+
66+
| Name | Type | Description |
67+
| -------------- | :----------------------: | ------------------------------------------------------------------------------------------------------------------------------------- |
68+
| **translateX** | `string[]` or `number[]` | Start and end translation on x-axis in `%` or `px`. If no unit is passed percent is assumed. Percent is based on the elements width. |
69+
| **translateY** | `string[]` or `number[]` | Start and end translation on y-axis in `%` or `px`. If no unit is passed percent is assumed. Percent is based on the elements height. |
70+
| **rotate** | `string[]` or `number[]` | Start and end rotation on z-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
71+
| **rotateX** | `string[]` or `number[]` | Start and end rotation on x-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
72+
| **rotateY** | `string[]` or `number[]` | Start and end rotation on y-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
73+
| **rotateZ** | `string[]` or `number[]` | Start and end rotation on z-axis in `deg`, `rad`, or `turn`. If no unit is passed `deg` is assumed. |
74+
| **scale** | `number[]` | Start and end scale on x-axis and y-axis. |
75+
| **scaleX** | `number[]` | Start and end scale on x-axis. |
76+
| **scaleY** | `number[]` | Start and end scale on y-axis. |
77+
| **scaleZ** | `number[]` | Start and end scale on z-axis. |
78+
| **opacity** | `number[]` | Start and end opacity value. |
7279

7380
### Easing Presets
7481

0 commit comments

Comments
 (0)