IE8 Блокирует элементы шириной / высотой, не обнаруживая наведение мыши, пока текст внутри не наведен

Question

В IE8 элементы блока с заданной шириной / высотой будут отображаться правильно, но события мыши и связывание работают только для текста внутри этого элемента.Мышь не будет обнаружена, пока текст внутри элемента не наведен.Если это ссылка, то текст будет кликабельным.Если я удаляю doctype (отправляю его в режим причуд), он работает нормально, но нарушает многие стили на сайте.Можно ли как-нибудь заставить это работать правильно?

Answer 1

Есть много проблем с традиционными событиями мыши.Я настоятельно рекомендую использовать события mouseenter () и mouseleave () в JQuery.Они путешествуют через дом, чтобы убедиться, что мышь находится внутри или вне рассматриваемого объекта.Существует даже сокращение для обязательных событий;вы можете использовать вспомогательный метод hover (), чтобы связать оба события с элементом сразу, как показано ниже:

$( "#some-element" ).hover(
  function(){
   // mouse is inside the element
  },
  function(){
   // mouse is outside the element
  }
);

Проверьте это

Надеюсь, это поможет.

Answer 2

Это было вызвано наличием тега noscript на странице.Удаление это решило проблему.Я понятия не имею, почему это было бы так, но, возможно, кто-то еще может уточнить.

Answer 3

У меня недавно была похожая проблема, когда событие mouseenter работало только в том случае, если вы находились поверх ссылки внутри элемента блока.(Однако моя проблема была связана с IE 7.)

Попробуйте добавить zoom: 1 к элементу блока.

#myBlockElement {
    zoom: 1;
}

http://www.satzansatz.de/cssd/onhavinglayout.html

---

Я также согласенс другим ответом о с использованием .hover() вместо mouseenter и mouseleave, но одно это, вероятно, не решит вашу проблему с IE.

---

Мне также нравитсячтобы убедиться, что у меня есть действительный DOCTYPE и что моя страница полностью соответствует в W3C Validator перед тем, как приступить к решению проблем с IE.