当用户将鼠标悬停在某个元素上时,我想添加和删除元素上的类,但前提是它们的光标已超过1秒,例如。我怎样才能做到这一点?
$("#thumbs div").mouseenter(function() {
$('#thumbs div').removeClass('hovered');
$(this).addClass('hovered');
});
答案 0 :(得分:30)
使用计时器:
var timer;
$("#thumbs div").mouseenter(function() {
var that = this;
timer = setTimeout(function(){
$('#thumbs div').removeClass('hovered');
$(that).addClass('hovered');
}, 1000);
}).mouseleave(function() {
clearTimeout(timer);
});
答案 1 :(得分:1)
您可以使用悬停和延迟:
$("#thumbs div").hover(function() {
$(this).delay(1000).queue(function(){
$(this).addClass('hovered').siblings().removeClass('hovered');
});
},function() {
$(this).finish();
});
答案 2 :(得分:0)
var timer;
$("button").on("mouseenter", function() {
timer = setTimeout(function() {
$(".box").css("background", "blue");
}, 1000);
});
$("button").on("mouseout", function() {
$(".box").css("background", "red");
clearTimeout(timer);
});