Megamenu becomes invisible when scrolling

christianrieger

Hi!

When I'm scrolling a page the megamenu more and more moves down till it is completely invisible.

Example page: http://www.mathelike.info/Abiturskript-Mathematik-Bayern/2-Geometrie/2.1-Vektoren/

Best regards,
Christian

saguaros

Hi Christian,

I scroll down that page but the dropdown of megamenu is still visible:

christianrieger

i just also tried with chrome and it is still visible but with a distance to the sticky nav. With Safari the megamenu becomes completely unvisible the more you scroll

saguaros

It due to your custom CSS in file: /templates/ja_justitia/local/css/custom.css

.t4-megamenu.animate .dropdown > .dropdown-menu {
    position: fixed;
...
}

christianrieger

This custom css was updated by JoomlArt because of my request https://www.joomlart.com/forums/d/40584-full-width-mega-menu-possible/7

How should it be changed to work properly?

saguaros

christianrieger

Try to change:

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

to:

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;
}

christianrieger

Many thanks, I have changed as described. But now the megamenu is no longer fullwidth when a site is scrolled and sticky nav is active. Instead of this the megamenu has the width which is st in the template configuration.

changes to

saguaros

Hi christianrieger

I see the issue, let me check and will get back to you.

christianrieger

Hi!
Okay, many thanks for your support!