Question

我制作了一个带有粘性标头的网站，并且效果很好。其他一些人也使用它并进行了一些更改，但是现在页眉的粘性不起作用。我试图放回旧代码，但没有帮助。

var modalBtn = document.querySelector(".cta-add"),
  modalBg = document.querySelector(".modal-bg"),
  modalClose = document.querySelector(".modal-close");
modalBtn.addEventListener("click", function() {
    modalBg.classList.add("bg-active");
  }),
  modalClose.addEventListener("click", function() {
    modalBg.classList.remove("bg-active");
  }),
  $("#booknow")
  .on("click", function() {
    $.getScript("https://fareharbor.com/embeds/api/v1/?autolightframe=yes");
  })
  .done(function() {
    window.location.href =
      "https://fareharbor.com/embeds/book/.../items/148437/?full-items=yes&flow=no";
  });

$("#contact").on("click", function() {
    $.getScript("headers.php?file=recaptcha.js");
  }),
  (window.onscroll = myFunction);
var header = document.getElementById("myHeader"),
  sticky = header.offsetTop;

function myFunction() {
  header.classList.toggle('sticky', window.pageYOffset > sticky);
}

function openTab(e, t) {
  var n, c, a;
  for (
    c = document.getElementsByClassName("tabcontent"), n = 0; n < c.length; n++
  )
    c[n].style.display = "none";
  for (
    a = document.getElementsByClassName("tablinks"), n = 0; n < a.length; n++
  )
    a[n].className = a[n].className.replace(" active", "");
  (document.getElementById(t).style.display = "block"),
  (e.currentTarget.className += " active");
}
const hamburger = document.querySelector(".hamburger"),
  navLinks = document.querySelector(".nav-links"),
  links = document.querySelectorAll(".nav-links li");
var mylogo = document.getElementById("myLogo");
hamburger.addEventListener("click", () => {
    navLinks.classList.toggle("open"),
      links.forEach((e) => {
        e.classList.toggle("fade");
      });
  }),
  $(document).ready(function() {
    $("#hamburgerID").on("click", function() {});
  }),
  $(".nav-links li a").on("click", function() {
    $("#hamburgerID").click();
  });

.sticky {
  position: fixed;
  top: 10;
  height: 20vh;
  width: 100%;
  align-items: center;
  background: #fff;
}

我在旧代码中实现了这一点，并且可以正常工作。我的问题是还有什么会导致此问题？

Answer 1

我将modalBtn.addEventListener函数更改为此：

modalClose.addEventListener('click',function(){
    modalBg.classList.remove('bg-active');
  });

现在很好，但是如果有人能告诉我旧代码有什么问题，我将不胜感激。

为什么Javascript粘性标头不起作用？

1 个答案: