Responsive Multi-Level Menu

okay, got it working now with wordpress menu. no need vor walker:

”,
‘container’ => ”,
‘echo’ => true,
‘fallback_cb’ => ‘wp_page_menu’,
‘items_wrap’ => ‘%3$s’,
‘depth’ => 2
);

wp_nav_menu( $defaults );

?>

$(‘#dl-menu .sub-menu’).addClass(‘dl-submenu’).removeClass(‘sub-menu’);
$(‘#dl-menu .dl-submenu’).prev().attr(‘href’, ‘#’);
$(‘#dl-menu’).prepend(‘Open Menu’);

Hello Mary Lou & everyone else,

I am a beginner and stuck with what to do next.
I uploaded the css and js folders,
I added this:
<link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/component.css" /> <script src="<?php bloginfo('template_directory'); ?>/js/modernizr.custom.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="<?php bloginfo('template_directory'); ?>/js/jquery.dlmenu.js"></script> <script> $(function() { $( '#dl-menu' ).dlmenu({ animationClasses : { classin : 'dl-animate-in-2', classout : 'dl-animate-out-2' } }); }); </script>

to my header.

and for testing I used the whole menu HTML you provided.

I tested it out and the menu button is visible but when I press it on an iPhone it doesn’t open.
Nor does it open in a browser (Chrome).
I checked fr errors and warnings ad this is the error that pops up:
event.returnValue is deprecated. Please use the standard event.preventDefault() instead.

If Miss Mary Lou can’t help, is there anyone else that can, please ?

how can i make this menu load without having to click on top level button?

Wow! What a very cool menu this is.
One moment I’m having troubles with, does any one know how to make the menu close when I click a menu item that doesn’t have sub-menus?

I use Modernizr version 2.8.3, but the menu does not appear.
With version 2.6.2 is ok.

How can I fix?

Doesnt work with WordPress…
i`ve put this in footer.php
————–

$(function() {
$( ‘#dl-menu’ ).dlmenu();
});

—————–

error
Uncaught TypeError: $ is not a function

I want this menu destroy and reset option added, I added the reset menu myself and it takes me to the start, means open the menu from the first level, even if I am from 2nd or any lower level. Then I tried trigger click of elements which can take me to the next level but that work but menu is closed automatically. Can you help me to resolve, actually I am adding new levels by ajax after initializing the menu, so if I don’t do reset menu newly added levels don’t work. I want this to work, and remain at the same level where menu was opened.

How can I make it so clicking on one of the top level items(What you click to open up a submenu) takes you to an anchor point at the top of the page?

I tried the following with no luck…

<a href=”#top” rel=”nofollow”>Brady Haran</a>

I’m not sure what else to try, I feel like that should work but it doesn’t. I have some very long menus that evolve scrolling down the page to read them all. It is frustrating to have to scroll back up to the top of the page every time I open up a new submenu.

Thanks,

Chris

Hey all,

great plugin! Thanks for sharing!

I have one problem with the size. In a normal browser, the button has the normal size. If I use a mobile device like an iphone, the button is really small and the menu entrys are small as well. I have to zoom in to use the menu.

How do I change the size of the button and the menu? What css tags are responsible for that?

Its on a dev environment with a pw, so I cannot show it. Hope you can say anything w/o seeing it. I use typo3 for the website.

Thank you for you help, I appreciate that!

It’s a very very nice menu… but as I can’t put anything in the space underneath it – i.e. where the menu will expand, it’s all a bit pointless.

The top of a screen is the critical area that your customers are going to see – not much use if it is blank.

Thanks for the effort though 🙂