Мышь и мышь не работают на firefox?

Question

Я хочу попробовать изображение слайд-шоу при наведении курсора мыши и остановки курсора мыши Ниже мой код: но с помощью мыши над мышью вне также calling..its работает отлично на хром ...

default_image = ''; 
timer = 0; 

jQuery('.sales-product-images').on('mouseover',function(){ 
    var counter = 0; 
    var selector = jQuery(this); 
    var pd_id = jQuery(this).attr('id'); 
    var imageArray = jQuery.parseJSON(images); 
    var product_images= imageArray[pd_id]; 
    default_image = jQuery(this).attr('data-image'); 
    console.log('default-image= ' + default_image); 
    timer = setInterval(function(){selector.fadeOut("fast", function() { 
     console.log(counter); 
     if (counter === product_images.length) { 
      console.log('=='); 
      counter = 0; 
     } 
     console.log('localhost/product/' + product_images[counter]); 
     selector.attr('src', 'localhost/product/' + product_images[counter]); 
     selector.fadeIn(2500); 
     counter = counter+ 1; 
    }); 
}, 2000)}); 


jQuery('.sales-product-images').on('mouseleave', function() { 
    console.log('now end'); 
    // var counter = 0; 
    clearInterval(timer); 
)}; 

проблема заключается в : «now end» также печатается на mouseover в firefox. Этого не должно быть.

Answer 1

Попробуйте это:

jQuery('.sales-product-images').on('mouseout', function() { 
    console.log('now end'); 
    // var counter = 0; 
    clearInterval(timer); 
)}; 

Answer 2

Проблема, скорее всего, вызвано использованием mouseover с mouseleave, когда это событие в паре должно быть mouseout. Сопряжения можно увидеть ниже.

Mouseover/MouseOut

$(".sales-product-images") 
    .mouseover(function() { 
     console.log("mouse over"); 
    }) 
    .mouseout(function() { 
     console.log("mouse out"); 
}); 

MouseEnter/MouseLeave

$(".sales-product-images") 
    .mouseenter(function() { 
     console.log("mouse enter"); 
    }) 
    .mouseleave(function() { 
     console.log("mouse leave"); 
}); 

Приведенные выше методы являются ярлыки для метода .on("", function(){}).

Вы можете переписать JavaScript следующим образом:

default_image = ''; 
timer = 0; 

jQuery('.sales-product-images').mouseover(function(){ 
    var counter = 0; 
    var selector = jQuery(this); 
    var pd_id = jQuery(this).attr('id'); 
    var imageArray = jQuery.parseJSON(images); 
    var product_images= imageArray[pd_id]; 
    default_image = jQuery(this).attr('data-image'); 
    console.log('default-image= ' + default_image); 
    timer = setInterval(function(){ 
     selector.fadeOut("fast", function() { 
      console.log(counter); 
      if (counter === product_images.length) { 
       console.log('=='); 
       counter = 0; 
      } 
      console.log('localhost/product/' + product_images[counter]); 
      selector.attr('src', 'localhost/product/' + product_images[counter]); 
      selector.fadeIn(2500); 
      counter = counter+ 1; 
     }); 
    }, 2000); 
}).mouseout(function() { 
    console.log('now end'); 
    // var counter = 0; 
    clearInterval(timer); 
});