Я пытаюсь применить какой-либо сценарий к навигационной панели, я хочу, чтобы навигационная панель придерживалась верхней части страницы при прокрутке до.Я знаю, что это можно сделать, как я делал это раньше, и это сработало.Однако на этот раз это не работает.
Я использую этот код - https://www.w3schools.com/howto/tryit.asp?filename=tryhow_js_navbar_sticky
Сайт здесь - http://www.mjlcarpentryltd.co.uk/
Я не знаю, еслиJavascript не просто не работает или не работает, или если есть другие стили, мешающие где-то.Любая помощь будет принята с благодарностью!
HTML
<div id="navbar">
<nav class="dropdownmenu">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">ABOUT US</a></li>
<li>
<a href="#">SERVICES</a>
<ul id="submenu">
<li><a href="cutandpitchroofing.html">CUT AND PITCH ROOFING</a></li>
<li><a href="trussroofing.html">TRUSS ROOFING</a></li>
<li><a href="1stfixing.html">1ST FIXING</a></li>
<li><a href="2ndfixing.html">2ND FIXING</a></li>
<li><a href="cladding.html">CLADDING</a></li>
<li><a href="staircases.html">STAIRCASES</a></li>
</ul>
</li>
<li><a href="projects.html">PROJECTS</a></li>
<li><a href="testimonials.html">TESTIMONIALS</a></li>
<li><a href="gallery.html">GALLERY</a></li>
<li><a href="contact.html">CONTACT US</a></li>
</ul>
JS
<script>
window.onscroll = function() {myFunction()};
var navbar = document.getElementById("navbar");
var sticky = navbar.offsetTop;
function myFunction() {
if (window.pageYOffset >= sticky) {
navbar.classList.add("sticky")
} else {
navbar.classList.remove("sticky");
}
}
</script>
CSS
.sticky {
position: fixed;
top: 0;
width: 100%;
}
nav {
display: block;
background-color: #76afdb;
width: 100%;
z-index: 99999999;
float: left;
position: relative;
}