slide-element

Using JavaScript to animate an element open and closed hasn't traditionally been a straightforward task, especially if it contains dynamically sized content. You could go with something like jQuery's slideToggle(), but that path would require you to take on a lot more code than necessary. Another option is using CSS to change the max-height value of an element, but this approach is filled with arbitrariness and difficult to pull off well when you're not sure how much content you'll be animating over. This library gets the job done using the Web Animations API, and it doesn't require elements to have fixed heights. Instead, element heights are calculated based on their contents, and then the appropriate values are applied to trigger a smooth, native transition. The animations themselves are powered by the same mechanics used within CSS transitions, making it one of the best ways to pull it off in terms of performance.