Megamenu in T4 responsive and fullwith?

waldo99

Hi,
I cannot get a problem solved:

using T4 with JA Ego Template.
https://www.fewo-scheiber.at/2022/

Would like to have a Megamenu that is FULLWIDTH of the screen and RESPONSIVE when having smaller screens.
To add 5 or 6 modules/images in a horizontal row.
Example: https://caprocat.com/otro-mundo/

But all I get is a Megamenu with fixed width in pixels that remains fix even on smaller screens.
Megamenu settings in the template style only provides width in px.
So there is an ugly scroll bar, looks oldfashioned. T4 docs about megamenu did not help.

Possible to have a really nice responsive megamenu??

thanks
Walter

saguaros

Hi Walter,

You can try this custom CSS:

body:not(.not-at-top) .t4-megamenu.animate .dropdown > .dropdown-menu {
  position: fixed;
  left: 0;
  right: 0;
  top: auto;
  margin: 0 !important;
  width: auto !important;
}

waldo99

Hi,
the solution is nice and works in most times.

But when having the megamenu open and scrolling down by mousewheel just a little bit
then the menue gets smaller, shrinking before fading out.

Sometimes when stop scrolling or scrolling up again this small megamenu remains visible instead of the fullwidth megamenu which shall cover the whole width. (or being invisible).
I does not disappear. And this is ugly.

How can I keep the fullwidth in every case or make this "shrinked" megamenu invisible?

Changing the fading settings in T4 did not help;
Same behaviour with all Animation styles. -> the fullwidth megamenu collapses and remains small on the left

regards
walter

saguaros

waldo99 Could you share the admin + FTP account? I will give it a try.

waldo99

saguaros

okay, please have a try! Data is submitted.
thanks

saguaros

We updated above code a bit, could you check?

waldo99

saguaros
perfect, thank you!