sub menus are not "responsive"

sub menus are not "responsive" was created by AxiomDeSigns

Posted 11 years 3 weeks ago #9996
Hi there,
I've been using maximenuck for years but with joomla 3 and bootstrap, I wanted to work more in the responsive world than just preset pixels, and have my sites be much more "fluid".

For reasons all my own, I wanted to make a drop down sub menu that was full width of the main menu.

Each sub menu link would then also be in its own column - for example: 5 menu links in one row, with one column each, spanning with whole width. Adding more or less rows and columns as I needed. Essentially, an inline list.

Similar in nature to your demo menus on the maximenuck page. The first long rounded blue menu "dummy link2 with params" (attached example)

The idea was so that when you click a "main menu" item you would then have all of its sub-menus on one line, underneath, horizontally and spanning the whole width of the content area.

I wrongly assumed that "plugin parameters" would allow me to do this in a responsive template. As I can already do this in pixel measurements through the template css.

The issue is that all sizing and positioning options are absolute and in pixel measurements rather than with bootstrap spans or as a percentage of the available area. It appears this is mainly due to the javascript files.

I expected that with the params plugin that I would be able to choose the positioning element type for the sub menu which would then allow for correct sizing to be responsive - where a "float:left;" with "width:100%;" and have each sub menu item title be a percentile of that 100% width.

But it appears that the element.style javascript sizing is only generated in pixels - that occurs before a class is even applied, and these cannot be overridden.

So the "fix" for instance, would be if your maximenu and params could be sized in pixel and percentages - so a column could be "col=20%;" not "col=XXXpx" (with a wrap function to create a new "row" when the column becomes smaller than it can display the links in-line.

Instead, as it is now, I already have to have every single sub menu measured to the pixel, with all their margins and padding for each and every "@media" call in bootstrap responsive layouts, and even with all that manual modification, a submenu will extend off the page in some case with no option to easily "scroll".

In short, it appears the whole sub menu structure is NOT responsive at all, nor does plugin parameters mention that It cannot help with this or I would not have bought it.

I actually thought your demo was just "older" and not actually how the joomla 3 version of maximenuck behaves.

Do you have a method for me to use percentages rather than pixels? Or percentage and pixels?
Last Edit:11 years 3 weeks ago by AxiomDeSigns
Attachments:
Last edit: 11 years 3 weeks ago by AxiomDeSigns.

Please Log in or Create an account to join the conversation.

Replied by ced1870 on topic sub menus are not "responsive"

Posted 11 years 3 weeks ago #9998
Hi
there is a lot of problems using the responsive with a megamenu. That's why most of them have developped a specific layout for mobile, and I have developped the plugin mobile
www.joomlack.fr/en/joomla-extension-maxi...ximenu-mobile-plugin

alse you can try the solution described in my tutorial
www.joomlack.fr/en/joomla-documentations...e-joomla-for-mobiles

CEd

Joomlack Webmaster and Developer

by ced1870

Please Log in or Create an account to join the conversation.

Replied by AxiomDeSigns on topic sub menus are not "responsive"

Posted 11 years 3 weeks ago #10000
Hi CED

yeah, I'm okay with making my template responsive, and simply enabling the "visible/hidden-phone" class built into the bootstrap css options for module locations (and other quick css fixes) solves the rest of the stuff.

So I don't really need the "mobile plugin" - I just simply have your accordionck appear when needed via the built in bootstrap class.

What I need to do is have the sub menus on a desktop allow responsive placement - without hard coding the pixel placement.
We don't always view sites at "full screen" so when we shrink them, I'd like my stuff to remain visible, and not have to horizontally scroll.

I can appreciate that to "offset" the sub menu left or right requires a -XXXpx setting - but surely there is a way to simply have it populate edge to edge of the div you have the module in and use margins and padding to allow centering - or other positioning.

See, the first level of meximenuCK works fine in this fashion, and wraps when it needs to. And the second level drop downs work fine in the sense of being "normal" - and they work fine adding columns and modules and stuff. So If I code for a 960px wide website, or whatever, all is good.

But if I have a responsive layout and stretch or shrink even 100px, only the parent level of maximenuck works as expected, and the sub menus fail.

So why can't the sub menus behave like the parent menus?

Please Log in or Create an account to join the conversation.

Replied by AxiomDeSigns on topic sub menus are not "responsive"

Posted 11 years 3 weeks ago #10001
actually - I just noticed...

on YOUR website, your "Extensions for Joomla" drop down beside your Home icon behaves just as I want...

how did you do that?

Please Log in or Create an account to join the conversation.

Replied by ced1870 on topic sub menus are not "responsive"

Posted 11 years 3 weeks ago #10004

but surely there is a way to simply have it populate edge to edge of the div you have the module in and use margins and padding to allow centering - or other positioning.

surely not :) else I would already have done that for long
the submenus are relative to its parent item, not to the main container

I will look how to implement a % width for the columns, this would be already great.
Please remind me next week, I will try to find the time
CEd

Joomlack Webmaster and Developer

by ced1870

Please Log in or Create an account to join the conversation.

Replied by ced1870 on topic sub menus are not "responsive"

Posted 11 years 3 weeks ago #10006

on YOUR website, your "Extensions for Joomla" drop down beside your Home icon behaves just as I want...

I have just used the margins to set the submenu to the left and give it the correct width
then I use the technique in my tutorial for all other resolutions

Joomlack Webmaster and Developer

by ced1870

Please Log in or Create an account to join the conversation.

Time to create page: 0.654 seconds

Fast and powerful creation, customizable and responsive.

Read More

We have 1100 guests and no members online