const Navbar = () => {
const navbar = useRef(null)
window.addEventListener('scroll', () => {
if (window.scrollY > navbar.current.offsetHeight + 550) {
navbar.current.classList.add('active');
}else{
navbar.current.classList.remove('active');
}
});
return (
<Fragment>
<nav id='navbar' className="nav" ref={navbar}>
<div className="container">
<h1 className="logo"><a href="/index.html"></a>My Website</h1>
<ul>
<li><a href="#" className="current">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Services</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</nav>
{/* other elements */}
</Fragment>
)
}