Question

这是菜单在点击和关闭时打开的图标。在Chrome上工作完美（Firefox和Opera也是如此）但在IE上是一个问题（菜单总是打开，点击时没有任何反应）。 IE的版本是IE11（Chrome IE11 2图片）jquery版本-3.2.1。

HTML

<div class="menu-toggle">
        <div class="mini"></div>
</div>

CSS

.menu-toggle {
    padding: 1em;
    position: absolute;
    top: .8em;
    right: .5em;
    cursor: pointer;
    background-color: silver;
}

.mini,
.mini::before,
.mini::after {
    content: '';
    display: block;
    background: #fff;
    height: 3px;
    width: 1.75em;
    border-radius: 4px;
    transition: all ease-in-out 500ms;
}

.mini::before {
    transform: translateY(-6px);
}

.mini::after {
    transform: translateY(3px);
}

.open .mini {
    transform: rotate(45deg);
}

.open .mini::before {
    opacity: 0;
}

.open .mini::after {
    transform: translateY(-3px) rotate(-90deg);
}

JS

$(".menu-toggle").click(function () {
      $(".site-nav").toggleClass("site-nav-open");
      $(this).toggleClass("open");
});

Answer 1

我解决了一个问题......它出现在css .site-nav（显示）上。 Ty都回应了。

Answer 2

检查此解决方案out并尝试使用以下代码。

$(this).addClass('open').siblings(this).removeClass('open');

我希望你会发现这个解决方案很有用

javascript代码无法在IE上运行

2 个答案: