jQuery: stuck jquery animation

Question

Для темы wordpress я конвертирую цветные изображения в черно-белые изображения, когда вы их просматриваете. Но когда вы двигаете мышью очень быстро, иногда изображение остается в черном & белым, пока вы не перевернете их снова.

Как исправить это, чтобы убедиться, что, когда я не нахожу изображения, он не останется на черном & белый?

Ссылка на демо: http://www.infictus.com/wordpress_demo/creafolio/

код:

function initImage(obj) 
     { 
     var $newthis = $(obj); 
     if ($.browser.msie) 
     { 
      $newthis = $newthis.desaturateImgFix(); 
     } 
     $newthis.addClass("pair_" + ++paircount); 
     var $cloned = $newthis.clone().attr('id', ''); 
     $cloned.get(0).onmouseover = null; 
     $cloned.insertAfter($newthis).addClass("color").hide(); 
     $newthis = $newthis.desaturate(); 
     $newthis.bind("mouseenter mouseleave", desevent); 
     $cloned.bind("mouseenter mouseleave", desevent); 
     }; 

     function desevent(event) 
     { 
     var classString = new String($(this).attr('class')); 
     var pair = classString.match(/pair_\d+/); 
     // first I try was $("."+pair).toggle() but IE switching very strange... 
     $("."+pair).hide(); 
     if (event.type == 'mouseenter') 
      $("."+pair).filter(":not(.color)").show(); 
     if (event.type == 'mouseleave') 
      $("."+pair).filter(".color").show(); 
     } 

Answer 1

Я столкнулся с подобной проблемой раньше, и это вызвано с помощью мыши, воспитывающей новое MouseEnter/MouseLeave событие, прежде чем JQuery может обрабатывать предыдущая команда show(). Самый простой способ исправить проблему - добавить общую команду, чтобы вызвать все ваших цветных изображений до show() перед запуском фильтра до show/hide цвет и b & w изображение, с которым вы работаете.

Так, в принципе, изменить свой код на этот:

function desevent(event) { 
    var classString = new String($(this).attr('class')), 
     pair = classString.match(/pair_\d+/); 

    $(".color").show(); 
    $(":not(.color)").hide(); 

    if (event.type == 'mouseenter') 
     $("." + pair).filter(".color").hide(); 
     $("." + pair).filter(":not(.color)").show(); 
} 

Когда MouseEnter или MouseLeave события огня, сценарий сначала покажет все цветные изображения и скрыть все б & ш изображений. Затем, если это был центр мыши, скрипт скроет цветное изображение и покажет изображение b & w.