Hamburger menu in version 11

All Quick 'n Easy Web Builder support issues that are not covered in the forums below.
Post Reply
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Hamburger menu in version 11

Post by Ton »

Hi, I have upgraded to version 11 and everything works fine except the hamburger menu button of the ThemeableMenu.
It does not close anymore after selecting a menu item. Do you know how to fix this?
Thanks
User avatar
Pablo
Site Admin
Posts: 3925
Joined: Mon Feb 13, 2006 7:00 am
Location: Europe
Contact:

Re: Hamburger menu in version 11

Post by Pablo »

Which "hamburger menu" are you referring to? Because there are multiple menus that have a hamburger button.
Do you have a DEMO project so I can see all your settings?

Image
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

I have created a new test project TestMenu.qwb you can download here: https://we.tl/t-2qbzkRMqP2
When you make your browser screen smaller you will get the hamburger menu which expands when you click on it.
But it does not close when you click on one of the menu items.
User avatar
Pablo
Site Admin
Posts: 3925
Joined: Mon Feb 13, 2006 7:00 am
Location: Europe
Contact:

Re: Hamburger menu in version 11

Post by Pablo »

Thanks for the demo project.
However, it works correct.

The menu was not designed to close automatically.
The idea is that you link to another page so the browser will automatically close the menu.

This does not work different than before.
Maybe you are confused with another menu? For example, the Responsive menu does support Close on click functionality. This is a different type of menu.
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

No, I am not confused. Before I was using version 9 and with that version the hamburger menu closes.
I had not changed anything in my project, but when published with version 11 this behavior is changed.
I think the hamburger menu should always close, that is the normal behavior people are used to.
Is there any way I can make it work again like before?
User avatar
Pablo
Site Admin
Posts: 3925
Joined: Mon Feb 13, 2006 7:00 am
Location: Europe
Contact:

Re: Hamburger menu in version 11

Post by Pablo »

Do you have a project in the old format (QWB9), so I can see the difference?
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

Yes, I have just created a similar testproject in version 9: https://we.tl/t-UrDidTnU6K
User avatar
Pablo
Site Admin
Posts: 3925
Joined: Mon Feb 13, 2006 7:00 am
Location: Europe
Contact:

Re: Hamburger menu in version 11

Post by Pablo »

Thanks again for the project!

The reason why it works different is because since version 10 the Themeable menu uses Bootstrap5, which no longer depends on jQuery.

To re-add this functionality, you will have to add jQuery support to the page again.
I have updated your project to show you how to do this.
https://www.quickandeasywebbuilder.com/ ... stMenu.zip

I will investigate if a native solution can be implemented using Bootstrap 5.
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

Thanks! It works again with this solution.
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

After more testing, I have another issue with version 11.
With version 11, when you rotate the website on an iPhone with Chrome from portrait to landscape it does not resize to the full landscape width.
With a few rotates it gets smaller and smaller. This does not happen with version 9.
Do you know how I can fix this?
User avatar
Pablo
Site Admin
Posts: 3925
Joined: Mon Feb 13, 2006 7:00 am
Location: Europe
Contact:

Re: Hamburger menu in version 11

Post by Pablo »

Maybe you have place the HTML object from my demo outside the page boundaries?
Do you have a demo project?
Ton
Posts: 34
Joined: Thu Jun 13, 2019 8:33 am

Re: Hamburger menu in version 11

Post by Ton »

Thanks, I had placed the HTML object next to the page, I have now placed it at the end of the page and the issue is solved.
Post Reply