我有一个带有类淡入淡出对象的元素,当鼠标处于非活动状态一定时间(在这种情况下为5000毫秒)时淡出,并在再次移动鼠标时淡入淡出.
这是我正在使用的代码：
var timer;
$(document).mousemove(function() {
if (timer) {
clearTimeout(timer);
timer = 0;
}
$('.fade-object').fadeIn();
timer = setTimeout(function() {
$('.fade-object').fadeOut()
},5000)
})
如何使鼠标光标以同样的方式淡入淡出,与我的淡入淡出对象div同步？
解决方法
在html的CSS中设置cursor：none并防止在淡出后直接发生的mousemove事件重新显示该项目.
Demo
$(function () {
var timer;
var fadeInBuffer = false;
$(document).mousemove(function () {
if (!fadeInBuffer) {
if (timer) {
clearTimeout(timer);
timer = 0;
}
$('.fade-object').fadeIn();
$('html').css({
cursor: ''
});
} else {
fadeInBuffer = false;
}
timer = setTimeout(function () {
$('.fade-object').fadeOut()
$('html').css({
cursor: 'none'
});
fadeInBuffer = true;
},5000)
});
});