Topic: Side Nav not closing when clicking background

06chaynes pro asked 5 years ago


Expected behavior Clicking the background mask when the side nav is open will close the side nav Actual behavior The side nav remains open Resources (screenshots, code snippets etc.)

How can I toggle the side nav closed when the user clicks the background mask? Is there a class


Magdalena Dembna staff answered 5 years ago


Hi, Could you provide a code snippet for your case? In our demo application exactly the same behavior of the sidebar and background overlay are presented on the following page: Navigation -> Pro -> SideNav and I'm surprised that clicking the background mask doesn't toggle your side nav by default. Kind regards, Magdalena


06chaynes pro answered 5 years ago


I saw you added an id to the mask, so I was able to add a listener for this:

document.addEventListener("click", function(e) { if (e.target && e.target.id == "sidenav-overlay") { app.toggle = false; } });



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB Vue
  • MDB Version: 5.1.1
  • Device: MacBook Pro
  • Browser: Chrome 73.0.3683.75
  • OS: macOS 10.14.3
  • Provided sample code: No
  • Provided link: No
Tags