Question

我相信我很亲近。我的切换工作完全水平，但不垂直。当我的切换是垂直的时，切换的信息只能在第3个切换下查看，而不是直接在其指定的切换标题下（希望这有意义 - 在编码中看到）我似乎无法为切换添加可调高度，我'已经厌倦了很多方面都没有用我想让高度成为内容的高度。任何帮助将不胜感激。

 var divs = ["Soft", "Broch", "tut"];
    var visibleDivId = null;

    function toggleVisibility(divId) {
      if(visibleDivId === divId) {
        visibleDivId = null;
      } else {
        visibleDivId = divId;
      }

      hideNonVisibleDivs();
    }

    function hideNonVisibleDivs() {
      var i, divId, div;

      for(i = 0; i < divs.length; i++) {
        divId = divs[i];
        div = document.getElementById(divId);

        if(visibleDivId === divId) {
          div.style.display = "block";
        } else {
          div.style.display = "none";
        }
      }
    }

a{
  display: block;
}

  <a href="#" onclick="toggleVisibility('Soft');">soft</a>
  <a href="#" onclick="toggleVisibility('Broch');">broch</a>
  <a href="#" onclick="toggleVisibility('tut');">tut</a>
  
  <div id="Soft"  style="display: none;">Soft div</div>
  <div id="Broch" style="display: none;">broch div</div>
  <div id="tut"   style="display: none;">tut div</div>

切换功能正常。按一个切换其他人不活动。任何建议都会非常有帮助

Answer 1

不只是在改变dom中的顺序吗？

  <a href="#" onclick="toggleVisibility('Soft');">soft</a>
  <div id="Soft" style="display: none;">Soft div</div>

  <a href="#" onclick="toggleVisibility('Broch');">broch</a>
  <div id="Broch" style="display: none;">broch div</div>

  <a href="#" onclick="toggleVisibility('tut');">tut</a>
  <div id="tut" style="display: none;">tut div</div>

使用高度调整创建垂直切换

1 个答案: