mootool 1.1, как остановить событие, когда сделать еще одно событие

Question

У меня есть DIV элемент с эффектом Fx.styles

при наведении курсора мыши: ширина 300px

и MouseLeave: эта ширина 100px.

Теперь, когда я делаю MouseOver, ширина бежать от 200px до 300px,

Но когда ширина бежать 250px, я бы MouseLeave и я думаю, что ширина будет работать от 250px до 100px.

Мое мнение ошибочно, ширина от 200 до 300 пикселей, а затем обратно до 100 пикселей.

Как мой думать сбылась: D

<div id="element" style="width:200px;"> 
     Content content content 
    </div> 
    <script> 
    var myEffects = new Fx.Styles('element',{ 
       unit: 'px', 
       duration: 400, 
       }); 

     $('element').addEvents({ 
      'mouseover' : function(e){ 
       new Event(e).stop(); 
       myEffects.start({ 
        'width': 300 
       }); 
      }, 
      'mouseleave' : function(e){ 
       new Event(e).stop(); 
       myEffects.start({ 
        'width': 100 
       }); 
      } 

     }); 
</script> 

Answer 1

в 1.2+ вы можете передать "link": "cancel" к экземпляру Fx, и он будет работать. не так в 1.11 - но вы можете применить .stop() экземпляра вместо:

http://www.jsfiddle.net/zbKLj/

var myEffects = new Fx.Styles('element', { 
    unit: 'px', 
    duration: 400 
}); 

$('element').addEvents({ 
    'mouseenter': function(e) { 
     myEffects.stop().start({ 
      'width': 300 
     }); 
    }, 
    'mouseleave': function(e) { 
     myEffects.stop().start({ 
      'width': 200 
     }); 
    } 

}); 

Обратите внимание, вы должны использовать mousenter/mouseleave ИЛИ mouseover/mouseout и не смешивать их. на самом деле, просто забудьте о mouseover/mouseout парах, поскольку они могут ложно пузыриться в IE, когда у элемента контейнера есть дети (он будет запускать мышь, когда над дочерним элементом).

Кроме того, Запятая на параметры объекта будет вызывать ошибки IE, я надеюсь, что это было только ради примера :) в

Answer 2

1,11 имеет опцию «ждать», который является либо true или false. Пожалуйста, обновите хотя :-)