Simple Accordion

117682821_300351297690070_1386402168722889951_n.jpg
Patrick Watertor
Leiout Developer
Published on 07/16/2021
Help Article Plugins

Description

Simple Accordion using HTML and Javascript.

WRAPPER

Simple Accordion using HTML and Javascript.

SLIDE
JS
WORKING EXAMPLE
What's the fastest delivery option?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu. Sed felis purus, tempor ac vestibulum nec, consectetur at purus.
How do I change my payment method?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu. Sed felis purus, tempor ac vestibulum nec, consectetur at purus.
What's your return policy?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu. Sed felis purus, tempor ac vestibulum nec, consectetur at purus.
Do you have price breaks on large quantity purchases?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu. Sed felis purus, tempor ac vestibulum nec, consectetur at purus.
Do you deliver on holidays?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu. Sed felis purus, tempor ac vestibulum nec, consectetur at purus.
What are you most popular items?
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur vehicula porttitor rutrum. Ut laoreet sodales rutrum. Ut eget tristique nibh. Cras mattis est eget lacus dignissim, non consectetur velit pellentesque. Ut sit amet placerat eros, id gravida arcu.
CSS for Working Example
DOWNLOAD
NOTES
You can style your accordion in any way you would like! This example uses the same style as the Rythm template and is shown above.
Lottie Animations

26, Feb 2023
Help Article
Navik Mega Menu

This article explains how to create and use the mega menu functionality in Leiout navigation menus.

20, Sep 2021
Help Article Design
Google Translate

This article explains how to install and use Google's translate javascript library and implement a b...

20, Sep 2021
Help Article
Mix Blend Mode

This help article explains the CSS mix-blend-mode property and how to incorporate it with hero image...

06, Aug 2021
Help Article Design