Disable accordion toggle on hover / mouse over

1

https://booking.discovernauts.com/en/privacy-notice/ . Here is my site .
The accordion works perfectly when clicking the title on desktop . However on mobile the accordion content opens when the title is hovered . How do i solve this ? I only want the content to show up on when users click on title . This is a wordpress site and i am using Divi accordion module

2

There could be something Wordpress is doing by default for mobile screens in the background.

Try adding a media query for phones on hover:

// screens smaller than 600px
@media only screen and (max-width: 600px) {
  accordion-container:hover {
    // prevent accordion from opening
    height: 0;
  }

  accordion-container:hover  .accordion-content {
    // don't show the content on hover
    display: none;
  }
}
3

Maybe just recheck your event listeners (If using just Vanilla JS) or documentation (if using any lib, framework).

Edit: There is a touchstart event-listener on the accordian container which is causing the problem. Try removing the et_pb_accordian class from the elements if possible.