Close

Accordion with Highlighted Item

This is an example of another accordion widget with the highlighted item feature, designed using CSS, HTML, JavaScript, and Bootstrap framework 4. The form consists of four accordion items. Each accordion item is given a collapsible effect to hide the non-active sections. The Bootstrap and CSS styles are imported to the code with their URLs. The card header is displayed with the styles of background color as #ececec, font-family as "Roboto", sans-serif, and box-shadow as 1px 1px 2px rgba(0,0,0,0.3). The card header turns its background color to #e0e0e0, in a hover event. The card header title is displayed using the font size of 1.3rem, and font-weight as bold. JavaScript methods have been used to create the minus icon on the accordion header, its functionality, and to highlight the selected accordion card. The background of the selected accordion header is set to change as #47b9de, in the active mode. Source: https://www.tutorialrepublic.com/snippets/preview.php?topic=bootstrap&file=accordion-with-highlighted-item

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 *