kích hoạt một sự kiện hover trì hoãn với Jquery

Question

Tôi đang cố gắng tạo ra hiện tượng di chuột chậm:

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

Nhưng sự chậm trễ là bị bỏ qua.

Bất kỳ ý tưởng nào?

Answer 1

delay() chỉ ảnh hưởng đến hàng đợi hoạt ảnh, nhưng trigger() là đồng bộ. Bạn có thể sử dụng queue() để sắp xếp một chức năng kích hoạt các sự kiện sau khi sự chậm trễ:

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

Answer 2

Phương pháp .delay() là tốt nhất cho việc trì hoãn giữa hiệu ứng jQuery xếp hàng đợi.

Để trì hoãn hiệu ứng ban đầu, hãy sử dụng chức năng setTimeout(). Bằng cách này, bạn có thể sử dụng mouseover() thay vì trigger('mouseover')

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

Answer 3

Các jQuery API nói:

sự kiện Chỉ tiếp theo trong một hàng đợi bị chậm trễ; ví dụ, điều này sẽ không làm chậm trễ các dạng không có đối số của .show() hoặc .hide() không sử dụng hàng đợi hiệu ứng.

lẽ bạn có thể thiết lập một bộ đếm thời gian, sẽ kích hoạt mouseover/out sau 500 ms sử dụng Windows.setTimeout