Eu tenho um elemento div básico para representar uma mensagem que mostro por alguns segundos e, em seguida, desvanece-se usando

$('#message').fadeOut(5000);

Eu quero ser capaz de cancelar o fade se o usuário passar o mouse sobre o div.

Como posso cancelar o desvanecimentouma vez que o método fadeOut começou a desbotar o div?

Meu código existente, abaixo, funciona se o mouse entrar no div enquanto ele está sendo mostrado, mas eu preciso permitir se o usuário passar por cima do div uma vez que ele tenha começado a desaparecer.

$('#message').mouseenter(function() {
  clearTimeout(this.timeout);
});
$('#message').mouseleave(function() {
  this.timeout = setTimeout("$('#message').fadeOut(5000)", 3000);
});
$('#message').fadeIn(2000, function() {
  this.timeout = setTimeout("$('#message').fadeOut(3000)", 3000);
});