JQuery Hover MouseEnter MouseLeave

Question

я пытаюсь сделать эффект парения, используя этот скрипт:

function itemhover(){ 
    $(".item").mouseenter(function(){ 
     $(".mask").fadeIn(); 
    }) 
    $(".item").mouseleave(function(){ 
     $(".mask").fadeOut(); 
    }) 
} 

Проблема заключается в том, что когда я наведите курсор мыши на любой предмет она исчезает в .mask всего, как я могу указать функция просто работать над элементом, который завис?

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

благодаря

Answer 1

Это звучит как .mask элемент содержится внутри вашего .item элемента. Если это так, вы можете использовать $(this), чтобы «установить область» зависающего элемента (это относится к зависающему элементу).

function itemhover(){ 
    $(".item").mouseenter(function(){ 
     $(this).find(".mask").stop(true, true).fadeIn(); 
    }) 
    $(".item").mouseleave(function(){ 
     $(this).find(".mask").stop(true, true).fadeOut(); 
    }) 
} 

Кроме того, вы можете цепи .stop(true, true) до вашего выцветанию эффекта анимации, чтобы остановить все ранее очередь анимации и перейти к концу последней очередью анимации.

Answer 2

вы можете использовать это заявление

$(".mask",this).fadeIn();