Jquery MouseLeave SetTimeout не работает

Question

У меня есть следующий код JQuery:

$(".name") 
    .on("mouseenter", function() { 
    $(this).find("ul").css({"font-size": "20px", 
    'color': "red"}); 
    }) 
    .on("mouseleave", function() { 
    setTimeout(function() { 
     $(this).find("ul").css({"font-size": "12px", 
     'color': "blue"}); 
    }, 5000); 
    }); 

Первая часть работает, но вторая часть нарушается.

Почему setTimeout не работает mouseleave?

Answer 1

Это проблема обзорной. $(this) внутри setTimeout не относится к $('.name'). Вы можете исправить это, установив переменную для this на правильном уровне и ссылаясь на это.

.on("mouseleave", function() { 

    var self = $(this); 

    setTimeout(function() { 
     self.find("ul").css({ 
      "font-size": "12px", 
      'color': "blue" 
     }); 
    }, 5000); 
}); 

Answer 2

Вместо $ (это), попробуйте передать в случае в качестве аргумента и использовать $ (event.target)