jquery событие, если курсор был на элементе в течение некоторого времени

Question

У меня есть div, и когда я указываю на него мышью, я хочу запустить событие. Но я хочу запустить его, только если курсор был на событии в течение некоторого времени.

Есть предложения как это сделать?

Answer 1

1. Добавьте событие наведения мыши, которое устанавливает таймер.
2. Добавьте событие наведения мыши, которое отменяет таймер.
3. Когда таймер истечет, сделайте то, что вы хотите сделать.

Answer 2

Вот пример:

$('#yourElement').on({
        mouseenter: function (){
            clearTimeout(testTimeout);       // [1]
            testTimeout = setTimeout(function(){  // [2]
                ...
            }, numberOfMiliseconds);
        },
        mouseleave: function () { //[3]
            clearTimeout(testTimeout);
        }
    }, '.whereIsYourElement');

[1], когда мышь входит в элемент, она удаляет предыдущий тайм-аут и увеличивает его [2] еще раз. Когда мышь покидает область [3], она также удаляет тайм-аут. Это дает желаемый эффект, что тайм-аут выполняется только в том случае, если мышь вошла и оставалась в элементе в течение некоторого времени.