codrops/multilevelpushmenu

An experimental push menu with multi-level functionality that allows endless nesting of navigation elements.

MultiLevelPushMenu

An experimental push menu with multi-level functionality that allows endless nesting of navigation elements.

article on Codrops

demo

LICENSING & TERMS OF USE

multilevelpushmenu's Issues

[enhancement] Add missing bower.json.

Hey, maintainer(s) of codrops/MultiLevelPushMenu!

We at VersionEye are working hard to keep up the quality of the bower's registry.

We just finished our initial analysis of the quality of the Bower.io registry:

7530 - registered packages, 224 of them doesnt exists anymore;

We analysed 7306 existing packages and 1070 of them don't have bower.json on the master branch ( that's where a Bower client pulls a data ).

Sadly, your library codrops/MultiLevelPushMenu is one of them.

Can you spare 15 minutes to help us to make Bower better?

Just add a new file bower.json and change attributes.

{
  "name": "codrops/MultiLevelPushMenu",
  "version": "1.0.0",
  "main": "path/to/main.css",
  "description": "please add it",
  "license": "Eclipse",
  "ignore": [
    ".jshintrc",
    "**/*.txt"
  ],
  "dependencies": {
    "<dependency_name>": "<semantic_version>",
    "<dependency_name>": "<Local_folder>",
    "<dependency_name>": "<package>"
  },
  "devDependencies": {
    "<test-framework-name>": "<version>"
  }
}

Read more about bower.json on the official spefication and nodejs semver library has great examples of proper versioning.

NB! Please validate your bower.json with jsonlint before commiting your updates.

Thank you!

Timo,
twitter: @versioneye
email: [email protected]
VersionEye - no more legacy software!

Current level

How can i identify the current level?

Not working properly in my Ubuntu chrome sometime..

Sometime, This demo is not opening properly in my chrome ( Ubuntu 13.04 ).

I noticed that this demo is not working properly while getting "no-csstransforms3d" class in the html tag..

Sorry for my Bad english.. :(

Thank you..

Fixed main content and slide menu as overlap

The menu on mobile pushes the main content on the page to the right.

I do now want to move this main content to the right, instead overlap the menu on top of the same.

Pls advise how I can achieve that.

Multi-Level Push Menu Header Fixed Position after clicking on any space place over the page

I want to make "Multi-Level Push Menu" section's position fixed so i mean header section.I can make header position fixed.It is ok but the problem is that my fixed header position is being deactivated when i scroll down my page after clicking any space place on overlay layout to close sidebar menu.I tried to use jquery to fix the problem,to make header section fixed after clicking any place on overlay to return the page but it did not work.?

Conflicts with elements that has a fixed position

After opening the menu it causes an issue with any element that has fixed position. Any work around for this?

Added inline styling breaks other css animations

On line: 213 in mlpushmenu.js:
this._setTransform('translate3d(0,0,0)');

Breaks some other css animations (if you have any) inside the menu area. In my code at least.
If you want a simple improvement. Change to:
this._setTransform('');

You remove all inline styling and there wont be any possible problems with this.

smooth transform and transition

whenever the tab is idle and reactive, the transition not smooth as expected. Is there any tips to hinder

AMD / UMD version

for easily detach any windows event

Previous Menu Titles (when overlapping)

When using overlapping how could we have vertically written in the previous tabs the name of the prios menus? like this...

I think it wil be an excellent feature.

Menu doesn't work in ie9

In ie9 mp-menu always shows regardless of screen size and the push effect doesn't work. Is there a fix for this?

Iphone 6 plus menu button as just one line

Hi, I implemented the menu and so far it's working great (I added the hack to let it srolling smoothly in iOS)

I have another issue. In both iphone 6 plus i could give a try i see just 1 out of the 3 lines the create the menu icon (the top one)

I tried both safari and chrome, portrait and landscape, without any success... work great in iphone 4 , android etc etc

BR
Duccio

Not Showing Part of the Menu

Any idea why part of the meni is goingto the left outside the view area of the window?, look:

More than one menu

Hi, I want to use more than one menu. But when I initialize a new mlPushMenu object and trigger the click on my button all my objects are fired. How can I tell to initialize an object in first button and different object on another button?

Selected list item issue

Hello - trying to work through an issue that my team and I have been spinning wheels on.

We're trying to use Javascript to get the menu to highlight whichever sub-section you are on. For example, the section is Budget and the sub-sections are Administration, Contacts, Documents, Videos. If you click on "Administration" it opens that sub-section and keeps the menu on the left open where you see all the sub sections. We would like "Administration" to be highlighted so you know you're in that subsection.

After going through this trial/error, we used the directory method approach, but it would be better to know how to highlight those list items based on selection (via click/touch).

Any insight would be greatly appreciated!

Failing to find classie requirejs

Have you ever managed to successfully load this with requirejs?

I am currently being returned:

ReferenceError: classie is not defined

if( classie.has( e, waypoint ) ) {

I would assume this is because classie.js is not AMD compatible?

My setup looks like this:

// RequireJS setup
requirejs.config({    
    defaultPath: 'javascript',
    // paths to plugins
    paths   :   {
        classie             :   'plugins/classie',
        modernizr           :   'plugins/modernizr',
        mlpushmenu          :   'plugins/mlpushmenu'

    },
    // dependency order if applicable
    shim    :   {
        mlpushmenu          :   ['classie','modernizr']
    }    
});

// Call to push menu
require(['classie', 'modernizr', 'mlpushmenu'], function() {
    new mlPushMenu(
        document.getElementById( 'mp-menu' ),
        document.getElementById( 'trigger' ), {
            type : 'cover'
    } );
});

Dynamic Page Content

I can't figure out why, but some of my pages I use this menu on, will not scroll all the way.

There is still content hidden that I can not scroll down too.

Please let me know what you think.

Can't scroll the menu when on a mobile device.

For a responsive menu this does not work that great on mobile devices, especially when rotating the device to landscape.

On large desktop screens, the menu works perfect!

I tried combining this with a custom jquery scrollbar but have not had any success yet.
http://manos.malihu.gr/jquery-custom-content-scroller/

On Iphone Menu

On the iPhone I made a tweak use on horizontal only appears 5 menus and i have like 20 and in browser also dont show all .. i made height: auto for content now i have access to all menu.

But on iPhone and Tablets with that tweak once i try to scroll down with menu open it instantly enters a sub-menu is there any way of only entering menu if u actualy click and not touch and slide up ?

fixed items no longer fixed after menu closes

I have 2 fixed div's for a simple icon page navigation and a “back to top” button that work fine when the page loads. They stay fixedand work as intended. Once I click on this menu and then close it, those elements are no longer fixed. They start to scroll with the rest of the page. Is there a fix for this to get those elements to stay fixed when the menu is closed?

Dynamically Added Elements

Is it possible for this plugin to recognize dynamically added menu items? I'm loading all of my menu content via JSON.

Navigation Menu does not open on mobile

Hello together,

I have implemented this wonderful function on my website. In the desktop version I have solved all the problems myself. But on the mobile version, there is one issue where I am not able to find any solution.

https://digital-admins.com/

In the mobile version of my site you are not able to open the left navigation menu.
You can rightclick my site and view the page source. The css and js file is linked in the header/footer.

If somebody could find my problem, this would be very helpful!
Thanks very much in advance!

best regards
Dennis

available in bower?

Is there a chance this might be available through a package manager like bower?

Thanks!

Awesome menu system!

Menu options very sensitive avoid scroll this menu

I have problem in mobile device when I try to scroll this menu if ammount of menu options not fit on all height of the screen, Apears that the menu is very sensitive, when I try to scroll the options are activated and avoid to scroll the menu to view all options bellow.

Best regads

In iOS 8.1 (iPhone 5, 6) Menu main button is not working, anyone have fixed or solution. In other devices even in iPhone 4s is working fine, kindly give me solution for iphone 5 and 6,

Hi
I am facing the problem In iOS 8.1 (iPhone 5, 6) Menu main button is not working, anyone have fixed or solution. In other devices even in iPhone 4s is working fine, kindly give me solution for iphone 5 and 6 how button will start working

thanks in advance

autoopen

is ist possible to add an option for 'autoopen'
or what todo if i want to autoopen the menu on startup

How can open particular level menu manually?

I have requirement like this.
i have one button.. on that click i want to open level 2 manually..how can i open that lever manually

Thank you

page scrolling isn't working with this menu?

I've been experimenting with this menu and it looks really good, and is a nice way to offer navigation on a site, however something I've done, I assume, has stopped page scrolling working:
http://www.cairnsmorecottages.co.uk/

Is this perhaps a bug/issue or maybe someone can spot the obvious mistake.

Appreciate it. Thank you.
NJ

on iphone mp-level 4 not working

Hi,
I tried using multilevel menu as hamburger and faccing and issue in iphone.
If i give more than 3 level to mp-level it doesnt works in iphone and refreshes when i click on menu.
Please help me with this.
RG,

Close menu on link click

Need a built in function to close menu items. I implement the following hack to close menu items when clicked.

// Hack to close items when clicked
$('.mp-close').mousedown(function () {
    $('body').click();
});

Native scroll on iPhone not working.

I noticed that the native scrolling seems to stop working when I applied this to my mobile site and started testing. It looks like there was a fix in the forums, but when I tried it the fix created other issues. Any ideas? Is there something in the JS that could be tweaked to not effect the smooth scrolling?

Support for jQuery 3.5.1 or 3+

Hi,
Does anyone have a fix for jQuery 3.5.1 or 3.0? Bind() is deprecated and it needs to be replaced.

Thanks.

Hold menus open

Hi will it be possible to hold the menu open after the content is loaded?

Remember last opened menu level...

Good afternoon

I see this project is long dead now.....

But is there a way to remember the last clicked menu level/position on next open?

Or is there a newer and similar mobile menu which does the same thing?

cheers
richard