我有一个带有类淡入淡出对象的元素,当鼠标处于非活动状态一定时间(在这种情况下为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事件重新显示该项目.
$(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) }); });