is there a way place a darker overlay over the main content ( when slidebars open ) ?

[halukkaramete]

Hello,

Thank you for this great tool. I cannot wait to implement this. I'm curious if there is any way to overlay a dimmed layer on top of the main content like this -> http://mac81.github.io/pure-drawer/

This overlay effect adds not only more awesomeness to the overall experience but also a good UI practice since it helps user put his focus where the focus is supposed to be.

[guyhamilton]

Sure, what I did is added a backdrop div then add a body class when the menu is open and remove it when the menu shuts. You can then use this body class to animate the backdrop in and animate other elements:

// Open
$('.toggle-id-1').on('click', function (event) {
  event.stopPropagation();
  event.preventDefault();
  controller.toggle('id-1');
  $('body').addClass('offcanvas-open');
});

// Close
$('.offcanvas-link').on('click', function () {
  controller.close();
  $('body').removeClass('offcanvas-open');
});

[rhinorck]

@guyhamilton could you please provide the html and css code as well. I would like to implement this as well.

[ghost]

thanks