Избегайте детей, чтобы помешать родителям парить. (или как .stop (false, true) css переход)

Question

Когда я оживляю вещи с помощью jQuery .animate().Я всегда стараюсь использовать .stop(false,true), чтобы избежать странного поведения анимации.

В этом случае я хотел, чтобы при наведении курсора на определенные участки отображалась навигация.Вот демонстрация:

http://jsfiddle.net/meo/Kbeg8/

Теперь, если вы медленно зависание серый элемент наверху, вы получите бесконечный цикл анимации, так какЭлемент, который летит, является потомком элемента, который запускает анимацию.

Поскольку я сталкиваюсь с этой проблемой не впервые, существует ли какой-либо чистый способ избежать этого?(Как дети не вызывают переход родителей) Если сейчас, как бы вы решили это с JS?

Answer 1

Да, есть чистый способ CSS3 сделать это. Требуемое имущество pointer-events

Добавление

nav ul {
    pointer-events:none;
}
nav:hover ul {
    pointer-events:auto;
}

, кажется, исправляет это для меня в Chrome 14.