On JA Social II, the Navbar disappeares when scrolling down. On FF it reappears when scrolling back up, on various Chrome browsers it stays hidden when scrolling back up.
I want to set it to be always visible (position:sticky), along with the headline/logo but I can not find the screws and bolts to make that happen. Any help on how to solve that would be much appreciated 🙂

    Hi tars108

    You can use this custom css:

    .scrollDown .t3-header {
  top: 0 !important; }

    put into the file: /templates/ja_social_ii/css/custom.css (Create this file if it doesn't exist)

        saguaros

        Super, that solves the problem with the header, strike one 🙂

        The problem of the disappearing Nav-Bar still remains, how can I solve that?

            tars108

            You mean that you want the navbar is sticky as well, right?

            You can use this custom css:

            .scrollDown .t3-mainnav {
  position: fixed;
  top: 129px;
  left: 0;
  right: 0;
  z-index: 999;
}
.scrollUp .t3-mainnav {
  position: fixed;
  margin-top: 129px;
  left: 0;
  right: 0;
  z-index: 999;
}

              Almost perfect, thanks a lot for this, Saguaros.
              Now it behaves like it should in FF and on Mobile (DuckDuckGo). On Chrome it behaves different, though. The Top Bars stay where they should, but once I scroll down on any page, I cannot fully go back up again. The top portion of the page stays hidden behind the top bars.

                tars108 Could you share screenshot highlighting the issue? I also tested on Chrome but it showed the same as other browsers.

                  Here it is.
                  After scrolling down and back up again I can only go up so far as it is seen on the picture. I just noticed that it behaves like this ONLY when I do it with the mouse wheel. If I am using the sidebar, the whole page goes up and down including the fixed header and navigation. With the mousewheel, header and navigation stay, and the only the rest of the page scrolls down (as it should), but not fully back up again

                    tars108

                    You can use this custom css:

                    .scrollUp .t3-mainbody {
    padding-top: 129px;
}

                    It will show full mainbody content when you scroll up.

                      7 days later

                      Super, everything works perfectly now. Case Closed 🙂

                      Write a Reply...
                      You need to Login to view replies.