Animated CSS3 Only Horizontal Accordion
HTML5, CSS3 and JavaScript
The Fine Art of Web Development by Martin Ivanov
This animated horizontal accordion was achieved without a single line of JavaScript, but only with CSS and minimalistic markup:
The widget utilizes a form with a list of hidden radio buttons, CSS3 transitions, transforms and sibling selectors, and works with all modern browsers, including IE9 (excluding the slide animation).
Have fun and use for free, but do not forget to check the actual CSS and HTML, because they are pretty cool!
Related Posts and Links
- HTML5, CSS3 and JavaScript Pie Charts
- Animated 3D Chessboard With Pure CSS3. No Images. No JavaScript
- CSS3 Rating Stars with Hover and Selection
- Animated CSS3 CD Cases on a Shelf
- HTML5, CSS3 and JavaScript Experiments and Insight
- Windows 8 Metro Style Tiles in HTML5, CSS3 and JavaScript
- Semtex HTML5, CSS3 and JavaScript UI Framework
- HTML and PHP Clicks, Hits and Downloads Counter System
- Animated CSS3 Notifications Bar
- Ribbon Bar Component
- CSS3 Treeview
- CSS3 Tabstrip
- CSS3 Slides Viewer
- Skinnable CSS3 Metro Form UI
- CSS3 Metro Dropdown Styling
- JavaScript Lazy Loader for Images
- Autocomplete and Autosuggest Widget
- Table Painter Widget for WYSIWYG Web-based Editors
Categories and Tags
Links
- Vuecidity - UI component library for VueJs
- Ribbon component for VueJs
- Ribbon component for jQuery
- Martin Ivanov portfolio and personal website
- HTML5, CSS3 and JavaScript experiments and insight
- RESTFul API for Encyclopaedia Metallum
- Avid Eleven Rack presets and rigs
© 2006 - 2023 Martin Ivanov