The theme you are using already have the same feature without this component.

Works good in OSSN 7.1!

Hey, I tested it with Awesome Theme on OSSN 6.4, but it's not working anymore.

Are you going to update?

Many thanks to Rafael Amorim for the code adjustment. I am still not able to make this component work for the White Theme I use but apparently it works on a number of other themes. Indeed, Facebook, built on OSSN 3.0 seems to be using this component now to make the upper bar scroll up when scrolling down and reappear when scrolling up. Please let me know if you have any success with this working for the White Theme and, if so please let me know what adjustments, if any, had to be made. Thanks!

Allon

With propper free time, I looked at your code, same as Arsalan and Michael do with my code all the time :-)

First of all, put the code on GitHub, not only the zip file. It allows other developers to look at your code and easily point out where is needed some fix.

Second, it is helpful if any new changes in your component are an increment in version, such as 1.1.1 or beta-1, beta-2, etc. It allows users and developers to check the local version and decide if an update is a good decision.

Finnaly, I tested the component on 6.1 with goblue theme (default installation). CSS code works, but JS code
document.getElementById("topbar") don't call nothing, because the div has a topbar class, not an id. So, my sugestion is:

var prevScrollpos = window.pageYOffset;
window.onscroll = function() {
  var currentScrollPos = window.pageYOffset;
  if (prevScrollpos > currentScrollPos) {
    $('.topbar').css('top','0px');
  } else {
    $('.topbar').css('top','-60px');
  }
  prevScrollpos = currentScrollPos;
}

This code solve the animation issues. Buttons and menu item at top right still need attention. Take a look on CSS.

I hope it helps.

Respectfully

Ok, I've uploaded a new V1.1 with some slight adjustments. I'm not getting any error messages now and hoping the community can help with the javascript code.

I am still getting error

ossn.site.js:2821 Uncaught TypeError: Cannot read properties of null (reading 'style')
at window.onscroll (ossn.site.js:2821:38)

There other issue as I mentioned in my first comment is the wall form is under the topbar so I can't write or select some menus of wall form Same with other pages profile , groups. etc

I can only provide feedback about errors I am not sure the logic behind your JS so I can't help with it.

Well, Michael provided the 2 different means...
The 1st appends the data to the head of the site without cache.
The 2nd lets the data be cached and minified.
I was thinking the 1st is the underwear and the 2nd is the pants.
Sorry if my thinking is wrong.
Also, can we please address the issue of the topbar not scrolling up when scrolling down as it's meant to? Thanks!

Just seen your code and as Michael explained to you about extend views I would like to ask you again

ossn_extend_view('js/ossn/site/head', 'js/topbarfocusizer');
ossn_extend_view('js/ossn.site', 'js/topbarfocusizer');

Sorry let me make a little Joke here, Why wearing two underwear same time? Why you are loading same JS two times in the same page? you need one of it only.

You're right, I uploaded the wrong one again. I forgot to save the new js file before zipping it up. Sorry.