Как остановить события от пузырей/нескольких событий с анимированными накладками?

Question

Я заметил много ответов JQuery на это, но я использую MooTools ...

У меня есть оглавление, которое использует CSS Исправлено позиционирование, чтобы сохранить его в левой части, за исключением 20 пикселей. Пользователь наводит курсор на 20 пикселей, что приводит к событию мыши на DIV, а ToC полностью переходит на страницу. Когда курсор уходит, ToC скользит назад туда, где он был.

$('frameworkBreakdown').addEvents({ 
    'mouseover': function(event){ 
     event = new Event(event); 
     $('frameworkBreakdown').tween('left', 20); 
     event.stop; 
    }, 
    'mouseout': function(event){ 
     event = new Event(event); 
     $('frameworkBreakdown').tween('left', (10 - $('frameworkBreakdown').getStyle('width').toInt())); 
     event.stop; 
    } 
}); 

Это хорошо работает (кроме несвязанных вопросов), за исключением того, когда я двигаю мышь на DIV он начинает джиттер, предположительно потому, что содержимое DIV также обжиг события, или refires события, как дорожки мыши над DIV.

Как я могу остановить это поведение? Существует ли стандартный метод или я использую какую-то неприятную глобальную переменную, которая определяет, действуют ли эффекты в действии и, таким образом, игнорирует событие?

Answer 1

Использование mouseenter/mouseleave вместо mouseover/mouseout.

Кроме того, вы не должны делать это в MooTools 1.2+:

event = new Event(event); 
event.stop; 

Простой event.stop() будет достаточно.