jquery mouseenter / mousleave IE 10 问题答案

【问题标题】：jquery mouseenter / mousleave IE 10 issuesjquery mouseenter / mousleave IE 10 问题
【发布时间】：2023-03-07 00:21:01
【问题描述】：

我使用 jquerys mouseenter / mousleave 创建导航。在除 IE 10 之外的所有浏览器下都能正常工作。

  $(".menu-item a").on("mouseenter", function() {
    "use strict";
      $(this).next(".menu-adds").children().addClass("active");
      $(".current_page_item").children(".menu-adds").children().removeClass("active");
  });


  $(".menu-item a").on("mouseleave", function() {
    "use strict";
      $(this).next(".menu-adds").children().removeClass("active");
      $(".current_page_item").children(".menu-adds").children().addClass("active");
  });

https://jsfiddle.net/a8omouec/2/

然而，在 IE10 中，当您将鼠标悬停在导航项上时，文本和图像会重叠。

没找到解决办法，不过好像是我的css没有问题。

【问题讨论】：

为什么不使用 css 呢？
这只是一个摘录，鼠标输入在整个版本中必须触发很多东西。所以我这样做了。感谢您的建议，但我想尝试使用 javascript/jquery。我也对 IE10 问题感兴趣。我无法想象它来自哪里。

标签： jquery navigation internet-explorer-10 mouseenter mouseleave

【解决方案1】：

作为临时解决方案，我将使用 Mediaquery for ie10+ 的转换设置为无。这并没有解决问题，但它对我来说是一个很好的解决方案。也许其他人对此协议感兴趣。

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    span.menu-image.active,
    span.menu-description.active {
            transition: none;
    }
}

https://jsfiddle.net/a8omouec/4/

【讨论】：