Close

Accordion Menu with Plus Minus Icon

This is another example of an accordion widget with plus and minus icon, designed using CSS, HTML, Bootstrap framework 4, and JavaScript. The font and Bootstrap styles are imported to the code with their URLs. The form consists of four accordion items. Each accordion item is given a collapsible effect to hide the non-active sections. The background color of the form is set as #2bba9e. The accordion card header is given the styles of background color as #fff, and font-family style as "Roboto", sans-serif. The card header changes its background color to #f8f8f8, in a hover event. The header title is displayed using a font-size of 1.3rem, and a font-weight as bold. The body of the accordion item is given a background color of #eaeaea, and font color of #595959. The header of the selected accordion card takes the color #202d3c, when active. JavaScript methods are used to create the minus icon on the accordion header, its functionality and highlight the header of the selected accordion card. Source: https://www.tutorialrepublic.com/snippets/preview.php?topic=bootstrap&file=accordion-menu-with-plus-minus-icon

Post Comment or Questions

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Several Related Snippets

Lorem ut labore et dolore magna aliqua. Ut enim ad minim veniam.