Menu icon Foundation
Long menu li floating on a second line / sub menu always on the right

Hello there,

Foundation menu provides very good css and javascript behavior, especially for mobile devices.

I was wondering what to do with long menus having last elements floating on a second line.

I have found a solution to create a last element that would appear when an element floats on a second line in a sub menu.

The only thing is that the sub menus and second level sub menus appear on the right where they should appear on the left.

Any idea how to do this ?

I will send some proper javascript I have written when it will be more readable.

Thanks.

José

menuFoundationfloating lisub menurtl

Hello there,

Foundation menu provides very good css and javascript behavior, especially for mobile devices.

I was wondering what to do with long menus having last elements floating on a second line.

I have found a solution to create a last element that would appear when an element floats on a second line in a sub menu.

The only thing is that the sub menus and second level sub menus appear on the right where they should appear on the left.

Any idea how to do this ?

I will send some proper javascript I have written when it will be more readable.

Thanks.

José

Rafi Benkual almost 5 years ago

Can you post what you have so far, maybe in Codepen so we can help? http://codepen.io/rafibomb/pen/HKxjl

José DESGRIS over 4 years ago

Hello again,

I have left the idea for a while and worked on it again for few hours.

You will certainly find in the test result I am not a great coder but well the idea is still there.

jQuery looks at the size of the screen, then takes all first elements (li), calculates overall width and chooses what to hide in a responsive dropdown (always present by the way for the moment).

I am not satisfied because its seems to lag when resizing and I have a back button appearing but here is what I have.

http://codepen.io/anon/pen/qdmLRQ

By the way, it appears it is a technique used on Deezer website.