Reduce the JS Workload with no- or lo-JS options
I have nothing against JS,
but it has better things to do
than manage your accordions and nav menus…
For years, JavaScript has been the web’s workhorse. If HTML or CSS couldn’t do what we wanted, we grabbed JavaScript to do it.
While that has helped push the user’s experience forward, the web is choking on JS. So as HTML and CSS continue to get stronger, we should transfer any JavaScript workload possible to them.
This is an organic collection of common JS patterns that can be replaced with just HTML, CSS, and no, or very low, JS. As HTML and CSS continue to mature, this collection should expand.
Most components have variations within the parent folder (for example, opening
css-carouselsreveals 8 variations within).
And all components have a corresponding CodePen in the top-levelREADMEthat demonstrates a working example.
Components
- Accordion - Adjust Marker
- Accordion - Animate Open/Close
- Accordion - Basic
- Accordion - Exclusive Open
- Accordion - Initially Open
- CSS Carousel - Animated Hero
- CSS Carousel - Animated Loop
- CSS Carousel - Hero
- CSS Carousel - Indicator Dots
- CSS Carousel - Navigation Buttons
- CSS Carousel - Simple Swiper
- CSS Carousel - Snappy Swiper
- CSS Carousel - Swipe by Groups
- Expanding Form Field
- Fly-In Content - Scroll Animation
- Image Comparison Slider - Basic
- Image Comparison Slider - Custom Handle
- Input with Dropdown - Number
- Input with Dropdown - Text
- Input with Dropdown - Time
- Lazy Load - Audio
- Lazy Load - Image
- Lazy Load - Video
- Modal/Popover - Add Backdrop
- Modal/Popover - Add Close Button
- Modal/Popover - Animate Open/Close
- Modal/Popover - Auto
- Modal/Popover - Manual
- Offscreen Content - Add Backdrop
- Offscreen Content - Add Close Button
- Offscreen Content - Animate Open/Close
- Offscreen Content - Related Content
- Offscreen Nav - Add Backdrop
- Offscreen Nav - Add Close Button
- Offscreen Nav - Animate Open/Close
- Offscreen Nav - Nav Menu
- Parallax - Perspective
- Parallax - Scroll Animation