While it is good to have this option, I would like to advise you to avoid this kind of navigation. A small movement of the mouse would stop the hover effect and the menu would disappear, and this gets very annoying. The classic layout of main horizontal menu and left side menu is quite good in terms of usability.
I did not create that menu. I just took a random screenshot from Google. So my point was that this kind of menu is not very usable - any small mouse movement outside the menu zone and it disappears
but literally every development language - including JQuery (javascript) has the capability
or has the flexibility to allow you to create such a menu.
As stated… I can do this in JQuery… but because it’s in JQuery… I cannot see the menu in preview mode.
It can only be seen in run-time. I understand the limitation of executing external client side code… but I still find it extremely frustrating. There are benefits of using JQuery - and of course, there are drawbacks.
Overlooking the hover state you mentioned twice…
I find the usefulness of submenus to be immense
but only if your menu’s are organized properly.
Especially in large scale systems… which I generally build.
In smaller systems… most of the time - I find them not to be needed.
That doesn’t change the usefulness of such a menu.
On a side-note - In jquery… the hover state issue… is a non-issue.
And as stated (above) about flexibility… Webflow already allows me the flexibility to do this. I would just prefer to do it natively within Webflow. I’m sure someone of @thewonglv skills and the very talented development staff @webflow could implement this feature. They just need the time and the prodding from the community to make this a priority… on top of their many other priorities.
Considering Webflow includes JQuery… I would find a sub-menu feature
that I and many others have requested
to be difficult to create… but very do-able - and a very much needed and desired feature.
I basically added text elements into a dropdown list, and added click interactions (and changed cursor style) to them to go through the pages. ​The second page is set 100% to the right, and interactions just move it around. Hope this is helpful! wouldn’t definitely be easier to manage links if those were dynamic links in the interior pages.
Almost - except 1 issue. - I need to dynamically bind the menus.
The method you provided works… but also requires an interaction to trigger for both DIV’s.
Because of this - it has be to done at development time… and cannot be done at run-time.
The menu system I am developing is created on-the-fly from a database (php / angularjs / mysql).
The available menu options are created based on the user’s authentication level and
the available menus options can change based on the user… in addition to authentication level.
So… a person with User Level 2… may have “these 20 options”…
and another person at User Level 2… has “these 15 options”…
all of which overlay the available “30 options”.
Another way of looking at this is…
Admin can grant Admin Access to another person.
It’s generally assumed… Admin controls everything.
But - In the application I’m developing…
An Admin can assign a new Admin… but with limited / selected Admin capabilities.
for example… “the new Admin cannot create a new Admin”.
The code itself is already developed.
(As much as possible) I’m trying to keep the interface and css within Webflow.
Otherwise… (should there be a design change) I have to manually update non-visual code.
which can be a pain in the buttholious.
(Unless Webflow’s changed this recently) Webflow stores the interaction / trigger code in seperate .js file.
I’ve ripped this js file apart a thousand times - and have been unable to dynamically add interactions and triggers at run-time.
Here’s an example: (it’s a bit convoluted)
I want an interaction base on a user level 1.
I want a different interaction based on user level 2.
I can create both interactions - but I must bind them to an element for the trigger to exist.
I review the JS and cut / save the interaction / trigger code into a localized “include file”.
Based on the user level… I dynamically insert the code… but the problem is
it appears the interaction are read at load - and cannot be dynamically added.
Or maybe they can… I just haven’t had the time to find the solution