Skip to content

Commit

Permalink
v2.0.0
Browse files Browse the repository at this point in the history
  • Loading branch information
alexspirgel committed Apr 13, 2021
1 parent 589fda1 commit d01d7e7
Show file tree
Hide file tree
Showing 8 changed files with 360 additions and 296 deletions.
29 changes: 19 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -42,40 +42,49 @@ CSS:
```css
.outer {
overflow: hidden;
transition-property: height; // and/or width
transition-property: height; /* and/or width */
transition-duration: 1s;
}
.inner {
overflow: auto; // optional, prevents margin overflow
overflow: auto; /* optional, prevents margin overflow */
}
```

JS:
```js
transitionAuto({
element: document.querySelector('.outer'),
height: 'auto'
property: 'height',
value: 'auto'
});
```

## Options

### `element`

Required. The element that will be transitioned.
The element that will be transitioned. The passed value must be an element reference. Required.

### `innerElement`

Optional. The inner element that will wrap the content and dictate the the 'auto' sizing. If no element is passed, the first child of the `element` will be used.
The inner element that wraps the content and dictates the 'auto' sizing. The passed value must be an element reference. Optional. If no value is passed, the first child of the `element` option value will be used.

### `width`
### `property`

At least one `width` or `height` must be set. Can be a number (assumed pixels) or a string (any unit). The value to transition the element to.
The property to transition. Can be 'height' or 'width'. Required.

### `height`
### `value`

At least one `width` or `height` must be set. Can be a number (assumed pixels) or a string (any unit). The value to transition the element to.
The value to set the `property` to. Can be a number (pixels) or a pixel string (ending in 'px'). Required.

### `onComplete`

A callback that triggers when the `element` has reached the desired height/width. This will wait for the transition to complete, but could be instant if no transition is present. The callback will pass the options object as a parameter. Note: if the transition of the element is interrupted by another call of `transitionAuto` on the same element, this callback will not trigger for the original call because the original transition never completed.

### `suppressDuplicates`

When `true`, calls of `transitionAuto` on an element currently transitioning to the desired value will be ignored. Defaults to `true`. Set to `false` to disable this feature.

### `debug`

Optional. Set to `true` to enable helpful console logs when debugging.
Set to `true` to enable helpful console logs when debugging. Defaults to `false`.
Loading

0 comments on commit d01d7e7

Please sign in to comment.