Question

亲爱的，菜单不能与任何版本的IE一起使用，我怎么能解决这个问题？下面是我的代码，CSS和JS菜单。

这是菜单：

<ul class="topnav">
  <li class="icon">
    <a href="javascript:void(0);" onclick="myFunction()">&#9776;</a>
  </li>
  <li><a href="#home">Home</a></li>
  <li><a href="#news">News</a></li>
  <li><a href="#contact">Contact</a></li>
  <li><a href="#about">About</a></li>
</ul>

这是我的JS：

<script>
  /* Toggle between adding and removing the "responsive" class to topnav when the user clicks on the icon */
  function myFunction() {
    document.getElementsByClassName("topnav")[0].classList.toggle("responsive");
  }
</script>

这是我的CSS：

ul.topnav {
    list-style-type: none;
    padding: 0;
    overflow: hidden;
    background-color: #333;
}


ul.topnav li {float: right;}


ul.topnav li a {
    display: inline-block;
    color: #f2f2f2;
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    transition: 0.3s;
    font-size: 17px;
}

ul.topnav li a:hover {background-color: #000000;}

ul.topnav li.icon {display: none;}


@media screen and (max-width:680px) {
  ul.topnav li:not(:first-child) {display: none;}
  ul.topnav li.icon {
      float: right;
      display: inline-block;
  }
}

@media screen and (max-width:680px) {
  ul.topnav.responsive {position: relative;}
  ul.topnav.responsive li.icon {
      position: absolute;
      right: 0;
      top: 0;
  }
  ul.topnav.responsive li {
      float: none;
      display: inline;
  } 
  ul.topnav.responsive li a {
      display: block;
      text-align: center;
  }
}

代码来自w3schools：http://www.w3schools.com/howto/howto_js_topnav.asp

我给他们发短信，但没有回复他们。

请问代码有什么问题。

Answer 1

编辑：我刚看到你在做什么，看了看其他评论，发现了我的错误。不支持classList，因此您可以使用className += " .."。

var div = document.createElement("div");
div.className += " imgWin";  // Add imgWin class to the div
div.appendChild(img);
content.appendChild(div);

如果您在div下获得所有列表项，然后最终将该类附加到您的div中，那么应该可以实现这一目标。

菜单不适用于任何版本的（IE）

1 个答案: