尝试仅在手风琴菜单未激活时显示 header

Question

我已经为这个问题困扰好几天了，我知道这是一个简单的解决方法，但我就是做不到！

现在，显示了我网站的 header，但是一旦单击手风琴项目，header 就会隐藏，但我正在努力做到这一点，如果 none的手风琴项目处于活动状态，再次显示 header。

这是我目前的代码：

var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
  acc[i].onclick = function() {
    $('.heading').hide(); 
    var active = document.querySelector(".accordion.active");
    if (active && active != this) {
      active.classList.remove("active");
      active.nextElementSibling.classList.remove("show");
    } 
    this.classList.toggle("active");
    this.nextElementSibling.classList.toggle("show");
  } 

};

我只需要在没有任何活动时显示标题！谢谢！

Answer 1

我假设 accodion 一次打开一个选项卡。这意味着当您单击一个活动的时，它会关闭所有设置。如果这是真的，我们可以简单地检查活动元素何时被点击，在这种情况下显示 "heading"

var acc = document.getElementsByClassName("accordion");
var i;

for (i = 0; i < acc.length; i++) {
  acc[i].onclick = function() {
    $('.heading').hide(); 
    var active = document.querySelector(".accordion.active");
if (active && active == this) {
      $('.heading').show(); 
    }     
if (active && active != this) {
      active.classList.remove("active");
      active.nextElementSibling.classList.remove("show");
    } 
    this.classList.toggle("active");
    this.nextElementSibling.classList.toggle("show");
  } 

};

Answer 2

我建议您声明一个 var count 全局变量。每次激活一个部分时，count 增加 1，即 count++，每次停用 - count--。

现在，如果 count <= 0 在任何时候 - 再次显示 header。

尝试仅在手风琴菜单未激活时显示 header

Trying to only show header when accordion menu is not active

javascript

jquery

accordion

toggleclass