使用Jquery触发延迟的悬停事件

Question

I'm trying to trigger a delayed hover event:

$(".graphic").delay(500).trigger('mouseover').trigger('mouseout');

But the delay is being ignored.

Any ideas?

Answer 1

delay() only affects the animation queue, but trigger() is synchronous. You can use queue() to schedule a function triggering the events after the delay:

$(".graphic").delay(500).queue(function(next) {
    $(this).trigger("mouseover").trigger("mouseout");
    next();
});

Answer 2

The .delay() method is best for delaying between queued jQuery effects .

To delay the initial effect, use setTimeout() function. By the way, you could use mouseover() instead of trigger('mouseover')

setTimeout(function () {
  $(".graphic").mouseover().mouseout();
}, 500); 

Answer 3

The jQuery API says:

Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of .show() or .hide() which do not use the effects queue.

Maybe you can set a timer, that will trigger mouseover/out after 500 ms using Windows.setTimeout