352media / flexmenu Goto Github PK

hey i have integrated your plugin code in my project. also i have loaded jquey version-3.1.1 before loading flexmenu.js. i am getting can not read property of "flexmenu" of null.

Hello!
I found a bug.
I turned off the style overflow="hidden" to better be seen.
Watch the video: https://drive.google.com/open?id=0B57RPXJWXRAjVHZsT1ZKdFlKOEE
How to fix it? Really need = (((

Hello,

I use flexMenu with Bootstrap v4 tabs but have a problem. Tabs are opening but they aren't closing. I added extra jQuery code;

$(document).on('click', 'li.flexMenu-viewMore', function(){ $('li.flexMenu-viewMore li a.active').removeClass('active show'); $(this).addClass('active show'); });

Live demo: http://demo.gloriathemes.com/wp/eventchamp/

Kind regards.

In Bootstrap 3, the dropdowns are not showing.
It seems that the flexMenu-popup can not overrule the "overflow: hidden;" of .js .menu
tried about everything.
Somebody got a fix?

flexMenu doesn't seem to work with nested ULs.

in this case, it's a menu with dropdowns.

any help much appreciated, thanks! love the script.

• Remove dependency on Modernizr.
• Determine whether we really need touch detection at all. If we switch from JS hover to CSS hover, will that work on touchscreens?

https://hacks.mozilla.org/2013/04/detecting-touch-its-the-why-not-the-how/

Test the plugin using zepto.js instead of jQuery. Try out the various options, and log issues in GitHub if anything goes wrong.

I am using flexmenu as described here.

files used:

flexmenu.css
modernizr.custom.css
demo.css

I am facing 2 issues.

1. menu list items not visible.
2. More Button link is not visible.
   

Hi,
im using flexmenu : when I click on an item that displays a modal, the modal appear behind the menu.
is thier any paraetre to add to my code
`// Flex Menu

	$('.menu').flexMenu({
		breakpoint: 3000,
		responsivePattern: 'off-canvas',
		animationSpeed: 300
	});

	$(".fm-button").click(function(){
		if($("header").css('right') == '0px'){
			$("header").stop().animate({right:'240px'},300);
		};
		if($("header").css('right') == '240px'){
			$("header").stop().animate({right:'0px'},300);
		};
	 });`

This method would replace the existing undo option, which is funky for a variety of reasons (most of which are outlined in the comments for this pull request. This method would be for users only, and wouldn't be triggered by the plugin itself. I'd either move the undo code into a private function or rewrite it to be more efficient. Either way, I'd like to ensure that the flexObjects variable is always accurate - sometimes it contains extra elements, for reasons described in the link above.

Cheers man, I like to use your menu.
Honestly I have not own smartphone, my friend with 4.5' android smartphone with chrome browser told me about this issue:

1. When expanded mobile menu is high , you gonna scroll down y-axis to see bottom list items of menu.
2. In mobile chrome on scroll bottom redundant address panel is sliding up, this way Window is resizing about Y-axis.
3. Flexmenu selfclosing on any 'resize' event, so User cant check bottom menu items with scroll, if its under bottom edge of the screen.

I solved this problem by adding resize handler, which is not working on y-axis resize.
Sorry for not good english.

        function ResizeHandler() {
		var windowW = $(window).width();
		return function () {
			if(windowW != $(window).width()){
				adjustFlexMenu();
				windowW = $(window).width();
			}
		}
	}

	var resizeHandler = ResizeHandler();
	$(window).resize(function () {

		clearTimeout(resizeTimeout);
		resizeTimeout = setTimeout(function () {
			resizeHandler();
			// adjustFlexMenu();
		}, 200);
	});
	/*$(window).resize(function () {
		clearTimeout(resizeTimeout);
		resizeTimeout = setTimeout(function () {
			adjustFlexMenu();
		}, 200);
	});*/

I suppose this is more of a suggestion, but if there's an easy solution I'd gladly implement it locally.

Basically, I need a way to trigger the flex menu relevant to the available space in the nav, not the available viewport space.

Specifically, I have a secondary nav floated to the right. The nav I'm initiating the flexMenu() function on does not recognize the that secondary nav, and so does not collapse the menu items until after that secondary nav has already broken below the primary.

If you need more explanation, just let me know — any advice would be greatly appreciated. It would also be a very handy option to add for other users I imagine.

Build an awesome new demo page to replace current one. Include a few different examples of what FlexMenu does and how people might use the various options in creative ways. CSS3 snazziness would also be great. Make it pop! ;)

When the window is resized, we undo flexMenu and then again to adjust the menus. In doing so, we reset flexMenu back to the default settings, even other settings have been specified.

See the bottom of demo.html for an example: after resize, the menus appear on hover instead of on click.

When something other than the flexMenu is clicked (e.g., when the background is clicked), close the flexMenu.

When I open the site the last two items on the menu are hidden (moved to the li tag with the class .flexMenu-viewMore). Although the menu fit on one line.

When I click "reload the page" in the browser, the menu is fully displayed in one line (as it should be).

When I change the width of the browser window the last two menu items are hidden, but should only hide the last menu item.

Here's a site where I do the menu: http://kupit-cheki.org
Please see this problem.

When swiped up or down to scroll through menu items, the flexMenu popup sometimes closes instead. Needless to say, this is unwanted behaviour and bad UX.
I guess this has something to do with viewport height (whenever viewport size changes, the popup menu closes?).
For example, in Chrome and Firefox (for Android), the browser address bar is shown when you swipe up and hidden when you swipe down. Whenever that happens, the flexMenu popup closes.
This also happens on the flexMenu demo page (http://352media.github.io/flexMenu/).
Here's a video demonstrating this:
https://www.dropbox.com/s/2ppiqitbu26tilg/flexmenuswipebug.mp4?dl=0

I have an implementation where I have an existing left nav and a top nav driven by flexmenu, on smaller screens i'd love to be able to append the hidden nav items to a 'more' nav in my existing left nav, an option to define a target element to append the hidden nav items into instead of the default would be awesome,

Hi,

I would like to ask something about incompatible problems while I run the command "bower install"
The following message is shown:
flexmenu#1.2 incompatible with 1.4 (latest is 1.1.1)
I have checked the dependencies and seems my project contains all flexmenu needs. Would you please advise what's the root cause?

Best Regards,
Alton

Can we have the same code working for Vertical menu(stacked), Right now this works for horizontal menu.

There should be a callback once the items are folded into the menu. . .the layout I'm working with has some items fixed at the top of the page, and depending on the height of the menu, the content container gets a dynamic padding-height added to it to compensate. . .when the flexmenu runs I want to be able to re-process the height of the menu and dynamically update the padding height to match the new size of my flexmenu

If there was a callback, I could easily apply my function that sets the padding to the callback.

When I click in the links that aren't in the drop down menu, they work fine

The links that end up in the drop down menu. This appears to happen on the demo on this site as well

(The hover text that appears in the browser status bar shows the link fine but nothing happens when it is clicked)

I've tested in Safari, Firefox and Chrome as well as Mobile Safari

If this works it's probably the best responsive menu I've seen!

Hi.
no matter what I do, I set threshold, cutoff, linkTextAll or linkTitleAll there is no effect. Just More is always shown.

Any idea?
Kind regards.

• Create dev branch
• Delete and re-create gh-pages branch so that master is its head, and so that we can merge from master to gh-pages as needed.
• Deal with line endings
• Write basic contribution guidelines - dev/master, JSlint/JShint settings, etc.

Thanks for the great menu - its served me well.
However I noticed an issue the other day. When viewing on a touch screen device with the menu open - it closes when you scroll down the screen making any links that fall off the bottom of the screen, (that you would have to scoll down to see), inaccessible.

Any ideas?

Cheers

Hi,
In touch device when i clicked a menu item which opens in new tab, and then after coming back to the site the menu item which i clicked goes under the more + menu.
For example:
Menu 1
submenu 1 ( external link )
submenu 2 ( external link )
submenu 3 ( external link )
Menu 2
.
.
.
More +
Sublinks of more menu
When i click the submenu 1 and then link open in new tab then i will close the tab and come back to the site the menu order changes likes this.
Menu 1
Menu 2
.
.
.
More +
submenu 1 ( external link )
submenu 2 ( external link )
submenu 3 ( external link )
Sublinks of more menu
No idea why this is happening. Kindly please advise.

Thanks,
Magu

Please add to npm!!!

Currently, the following function is run every time the window resizes:

function adjustFlexMenu() {
        if ($(window).width() !== windowWidth || $(window).height() !== windowHeight) {
            $(flexObjects).each(function () {
                $(this).flexMenu({
                    'undo' : true
                }).flexMenu(this.options);
            });
            windowWidth = $(window).width(); // Store the window width if it changed
            windowHeight = $(window).height(); // Store the window height if it changed
        }
}

Since the method used for checkFlexObject involves comparing the flexObject with the options attached, if the original flexObject did not have only the option

{
    'undo' : true
}

It will return -1 and add another instance to the flexObjects array.

The Plugin doesn't seem to work when I have a li item hidden.
My code is like this:

<ul>
<li class="hidden">User-img</li>
<li>MenuItem 1</li>
<li>MenuItem 2</li>
<li>MenuItem 3</li>
</ul>

The result is that alle the items are wrapped in the dropdown and none (except the "More" Link) is shown.

How can i use multiple flexMenu in same page?
Ex: menu1 shouldApply for all screen size and menu2 shouldApply if screen min-width 768px.
Thanks!

You tagged version 1.2 (as "1.2" whereas 1.1.1 has tag "v1.1.1" - incosistent), but bower.json still holds the version 1.1.1. Not correct, right?