Fade in and out on sticky navi

I'm trying to make my sticky navigation, I've been looking for, but I have no idea how I can add a fadein from top in navigation when it comes time for it to appear ...

I want the navigation when it appears, that it appears with a fade in from the top and that it fade out when it disappears, how do I do that?

Thank you guys!

Code:

/*Sticky nav*/

window.onscroll = function() {myFunction()};


var navbar = document.getElementById("navbar");


var sticky = navbar.offsetTop;


function myFunction() {
  if (window.pageYOffset >= 110) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}