Comments (27)
there are different versions, in repository and here
https://viljamis.com/responsive-nav-multiple-levels/
from responsive-nav.js.
Depends on implementation of dropdown list. It's up to your imagination.
from responsive-nav.js.
Could you add a feature that say, slides to the right when you have nested
- tags? Maybe add a link to go back at the top of each nested
- .
from responsive-nav.js.
How about support for multi-toggle with active parent links? Something like this: http://codepen.io/micahgodbolt/full/czwer
from responsive-nav.js.
That would be a nice valstu, have you tried adding it to the css to see if it works?
nvartolomei - do you have any samples? or will you be working on this in future releases?
from responsive-nav.js.
I second the support for nested drop down.
Has anyone found an appropriate solution/customization?
from responsive-nav.js.
Yep nested would be cool..
from responsive-nav.js.
please implement
from responsive-nav.js.
Any movement on this, yet?
from responsive-nav.js.
@jacobdubail Not yet. But I think this should be the next big feature to add.
from responsive-nav.js.
This is coming in the next release!
from responsive-nav.js.
Very cool. Any idea when the next release will be coming out? :)
from responsive-nav.js.
@sanstress Beta version is out now, please take a look and test drive it (there's a demo in the demos folder if you download it): https://github.com/viljamis/responsive-nav.js/tree/multiple-levels
from responsive-nav.js.
Also… please comment here if you find any bugs or would want to see the implementation to be somehow different before I merge this into the master.
from responsive-nav.js.
Does this version support drop down list for vertical menu?
from responsive-nav.js.
Does this prevent clicking on parent pages? Perhaps the icon could be where clicking to open the sub-pages could be performed?
from responsive-nav.js.
@S2web At the moment yes, but I'm gonna implement something like that before this will be merged into the master :)
from responsive-nav.js.
Good to know. I have seen the prevent from click on many multi-level vanilla js menus. While this can be appropriate in some cases it can also be an issue with some businesses or organizations content.
from responsive-nav.js.
Not sure if this is an issue or just an issue for me :), but the dropdowns were going behind divs when using with zurb foundation - so I added the below - which fixed it:
#nav {
z-index: 100;
}
from responsive-nav.js.
Definitely good to hear the option to prevent clicking on parent pages that @S2web mentioned is coming, that is key. But otherwise, testing the beta version of this script recently shows it works great on all moderns platforms and browsers, I had no issues at all.
I hope this is still going into the master and that v1.0.40 comes out soon. :)
from responsive-nav.js.
I have found a small problem with 7inch tablets. Well nexus 7 anyway. The touch of the navigation on drop down doesn't quite work. You have to tap just below the button, and then it automatically selects the top option in the drop down. I can't quite work it out. Its fine on iPads, phones etc
Has anyone else noticed this?
from responsive-nav.js.
Hi, i just wanted to comment on an issue regarding "preventing touch/drag" on parents of sub-levels.
Basically the problem happens when the menu list is "taller than the viewport", and not being able to swipe/scroll down the page to view the rest of the menu or even access the page content under the menu. There is something that prevents parents to be able to swipe.
Related issues here:
#117
#127
from responsive-nav.js.
@valstu How about support for multi-toggle with active parent links? Something like this: http://codepen.io/micahgodbolt/full/czwer
💯
We badly need such a solution, otherwise we can not open parent pages. So at time beeing we can not put content onto those pages as we can not open them.
We need a switch (option) to set the "open subpages"-event only onto the plus and minus symbols and let the anchor behave as a normal link.
from responsive-nav.js.
Who can solve the problem to solve it?
from responsive-nav.js.
Hi, many thanks for your work on the responsive nav plugin, it's helped me out a lot!
I have two main requests:
- Submenu support – the beta works well for me, though need fix for 'prevent from click parents'
- Ability to scroll a long open nav when using a fixed header (possible solution here on the fixed adtile version of this from MystK? adtile/fixed-nav#7
from responsive-nav.js.
http://viljamis.com/demo/responsive-nav-multiple-levels/ - is there a way to fix the parents are not working / showing the subs on touch? Tested on Honor Holly Device with Android 4.4.2 with Firefox
from responsive-nav.js.
I can't get sub menus to work. Anyone with a valid markup? Guess JS changes aren't needed. I've checked in the demo-folder in the downloaded package, but nothing there. Sigh..
from responsive-nav.js.
Related Issues (20)
- Navigation height with nested <ul> HOT 2
- responsiveNav is not defined HOT 2
- left nav cascaded
- Nav is buged
- closeOnNavClick variable changes location
- Multi-Level Responsive Nav
- Just a navigation. Clicking on navigation doesn't slide to anchor points?
- Checking if class exists
- Add opacity onScroll
- Support for Multi-level Nav HOT 1
- Appears from left or right
- Change hamburger to be an image so doesnt flash on page load
- Multilevel not opening on Android Chrome
- Using different customToggle when js-nav-active
- Plugin installation failed. (No valid plugins were found.)
- Nav not scrollable on dropdowns (where submenus available)
- Not working
- Unable to preventDefault inside passive event listener invocation. HOT 1
- How to initialize with a toggle?
- Explanation for installation process
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from responsive-nav.js.