Responsive Menu

  • Resolved grimdesigns

    (@grimdesigns)


    10 years, 5 months ago

    Hi I download the free version and I am considering the pro version but had a question.

    The reason I downloaded the free version is because I am using Ubermenu which I love. However the mobile menu that kicks in for Ubermenu is on the top and I want it to be on the left and collapsable from there. I could not figure it out so I am trying ShiftNav.

    So far it seems to emulate what I am looking for but when I resize the browser to the size I set the Shiftnav, it kicks in perfectly but if I then increase the browser size, the toggle button disappears but the Shiftnav menu still stays. I would have to resize the browser to get back the toggle button then collapse it and then increase my browser. I am trying to get the menu to react responsively, not just the toggle button.

    I hope I explained it correctly.
    Is there a way to not only hide the toggle button when the browser size is increased but to hide the Shiftnav menu as well.

    https://www.ads-software.com/plugins/shiftnav-responsive-mobile-menu/

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author sevenspark

    (@sevenspark)

    Hi grimdesigns,

    That is the intended functionality, as under normal usage a user wouldn’t be resizing the browser after opening the menu – but if they did, they probably wouldn’t want it to close.

    However, note that the menu should close as soon as you click anywhere else, whether the toggle is present or not.

    However, if you wanted to force the menu panel to shut above the breakpoint, you could add CSS like this:

    @media screen and (min-width:960px){
	.shiftnav-wrap {
	  -webkit-transform: translateX(0) !important;
	  -moz-transform: translateX(0) !important;
	  -ms-transform: translateX(0) !important;
	  -o-transform: translateX(0) !important;
	  transform: translateX(0) !important;
	}
	.shiftnav.shiftnav-left-edge{
	  -webkit-transform: translateX(-100%) !important;
	  -moz-transform: translateX(-100%) !important;
	  -ms-transform: translateX(-100%) !important;
	  -o-transform: translateX(-100%) !important;
	  transform: translateX(-100%) !important;
	}
}

    Hope that helps! ??

    Chris

    Thread Starter grimdesigns

    (@grimdesigns)

    Thanks Chris. I’m going to give it a try.
    While were on the topic, is there a way to just make the ubermenu keep the nav on the left for the mobile menu just the way it is on the desktop version ? If there was a, then I would prefer that as oppose to using ubermenu and shiftnav. Right now I am using ubermenu lite that came with the vellum theme but I can upgrade to ubermenu 3 if it provided a solution. For now, I’ll just try your solution with shiftnav

    Plugin Author sevenspark

    (@sevenspark)

    Hi grimdesigns,

    I’m not sure I follow what you mean, but the mobile menu in the pro version of UberMenu is the same as in the Lite version, so updating to UberMenu 3 wouldn’t have any effect on that scenario. You can control whether the menu is expanded or collapsed by default, but not where the menu appears. It can’t create an off-canvas navigation panel like ShiftNav.

    Best,

    Chris

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Responsive Menu’ is closed to new replies.