Close the menu in responsive when user clicks out of it

[Emkrypted]

Hi, I have seen that the menu works ok, but when it is responsive the problem is that it does not close automaticly if I click out of it, I must click again to the menu to close it, so I wonder how can I fix that? I mean if I click in another part that it's not the menu I'd like that it closes by itself. Thanks

[saraiva1989]

I don't know if it makes sense to implement this in the project, but if you need something like that, I made the script below that includes this functionality.

`

document.getElementsByClassName('container-fluid')[0].addEventListener('click', hideMenu)
document.getElementsByClassName('navbar-nav ml-auto')[0].addEventListener('click', hideMenu)

function hideMenu(){
    let menu = document.getElementById('accordionSidebar')
    if (!menu.classList.contains('toggled')) {
        menu.classList.add('toggled')
    }
}

`

Just add it to the bottom of your page, or create a .js and reference the pages you want to do this.

Below is the video showing the operation.

https://user-images.githubusercontent.com/40599423/138574179-76e5097e-eb41-4d87-be7c-c87e476a3bf7.mp4