Knowledge Base support case for AllWebMenus, abstracted and stripped of all user’s private info.
Initial Email From: Graham
Initial Email Subject: Webpage - Liquid layout
Support Case Month: April 2013
Hello there I am just about to do the updates to the above website and I would like to make the webpages a bit more flexible for the viewer by using a liquid layout which would allow the website to contract or expand to suit to viewers monitors resolution. I altered the webpages, but I'm having trouble withe the menus, bother the vertical and the horizontal menu bars. Is there anyway to get the menu bars to shrink or grow to match the viewer resolution? or do I have to make ... say 3 websites with low, medium or higher resolution. At the moment on my test website the menu bar only comes across half the screen, when viewed on a very large monitor and it's too long on a low resolution? If you can point me in the right area, I would appreciate it.
Many thanks,
Graham
Reply From: Likno Customer Support
Hello,
The solution you are looking for is a Responsive Menu. This is supported by AllWebMenus, so first of all you need to get the latest AllWebMenus version if you do not already have this (according to your Update Plan you can get this for free).
Once you have this you will note that the following option has been added in the “Global Properties”:
I recommend that you have 4 menu versions to accommodate for 4 different screen sizes. Note that the predefined sizes are set to match the computer screen, iPad in horizontal and vertical orientation and mobile phones.
Once you select this you will notice the following listbox:
From this point on, your menu has 4 different versions and you can select from this listbox which version you are editing at any given time.
Then all you have to do is to set different styles (and content and positioning) for your four menu versions, and compile and upload the menu to your pages normally.
Note that we have also added a Responsive example to help you get started:
Best Regards,
Kostas
Likno Customer Support
www.likno.com
Create any type of javascript menu (CSS menu, drop-down menu, sliding menu), button, html tree, modal window, tooltip, accordion, tab, scroller, jQuery slider or design for your websites!
Like us on Facebook – Follow us on Twitter
Reply From: Graham
Thank you very much, I have the latest version and will have a go with it. I had completely missed the Responsive Menus.
Again...many thanks
Graham
Tags: horizontal menu, ipad, layout, Menu, resolution, responsive menu, screen