Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Programmatically open/hide SmartMenus 2.0 #246

Open
VadimDorofeevRu opened this issue Apr 12, 2024 · 1 comment
Open

Programmatically open/hide SmartMenus 2.0 #246

VadimDorofeevRu opened this issue Apr 12, 2024 · 1 comment

Comments

@VadimDorofeevRu
Copy link

Is there any way to show / hide menu programmatically? I use custom toggle button but can't find any API method for those operations.

@vadikom
Copy link
Owner

vadikom commented Apr 15, 2024

Not in alpha1 (although it is coming very soon in the next alpha as I have already split the single navbar component into 3 separate components Nav/Collapse/Offcanvas and everything is more flexible with public show/hide methods for any Collapse/Offcanvas).

But in alpha1 you would need to hack around it with something like this (which is a bit simplified and stripped down version - for details, please check the _togglerAnchorShowClick/_togglerAnchorHideClick methods in the alpha1 code):

// Your current navbar init code
const navbar1 = new SmartMenus(document.querySelector('#navbar1'))

// Additional methods
const setNavVisibility = function(hide) {
  if (hide && this._opts.collapsibleResetSubsOnClickOn === 'toggler') {
    this.subHideAll()
  }
  const action = hide ? 'Hide' : 'Show';
  if (this._collapse) {
    this[`_animate${action}`](this._collapse)
  }
  if (this._offcanvas) {
    this[`_animate${action}`](this._offcanvas)
  }
  if (this._offcanvasOverlay) {
    this[`_animate${action}`](this._offcanvasOverlay)
  }
}.bind(navbar1);

const showNav = function() {
  setNavVisibility();
}

const hideNav = function() {
  setNavVisibility(true);
}

And then you can call showNav()/hideNav() to show/hide any collapse/offcanvas your navbar might contain.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants