.mouseleave () с .delay (), работающим вместе

У меня есть список из нескольких «триггеров» (

s

), каждый триггер показывает конкретный DIV, и каждый DIV имеет кнопку «закрыть».

Теперь я хочу улучшить удобство использования, добавив таймер / задержку к открытому / видимому DIV, чтобы через 3 или 5 секунд после того, как пользователь отодвинул свою мышь от триггера, открытый / видимый DIV исчезал.

Проблема, с которой я столкнулся прямо сейчас, заключается в том, что всякий раз, когда я добавляю функцию с помощью .mouseleave (), открытый / видимый DIV скрывается, как только мышь покидает область триггера.

Однако, если вы удалите функцию , то DIV остается видимым, и вы можете закрыть его, нажав кнопку закрытия.

Вот FIDDLE / DEMO моей ситуации.

Любая помощь будет принята с благодарностью.

] Спасибо.