Elementor Open Accordion On Hover Instead of Click
First, add this Elementor Open Accordion on Hover code
Insert the following code into an HTML element on the same page where your Elementor Accordion is located, allowing it to open on hover.
<script>
/* Code from https://element.how/elementor-open-accordion-hover/
* Version 1.0
* Copyright 2023 Element.How
*/
document.addEventListener('DOMContentLoaded', function () {
let hoverAccordion = document.querySelectorAll('.hoverAccordion .e-n-accordion-item-title, .hoverAccordion .elementor-tab-title');
hoverAccordion.forEach((item) => {
item.addEventListener('mouseenter', () => {
if (item.getAttribute('aria-expanded') == 'false' || (item.classList.contains('elementor-tab-title') && !item.classList.contains('elementor-active'))) {
item.click();
}
});
});
});
</script>
Then, add the class name hoverAccordion to your Elementor accordion element
Assign the class name ‘hoverAccordion’ to your accordion element by navigating to Advanced > CSS Classes.
