JQuery:鼠标移动淡入/淡出元素

Question

我有一个视频播放器页面，希望播放列表 div 仅在鼠标移动时淡入，如果鼠标空闲 3 秒则淡出。 div 的类是“fadeobject”，ID 是“”video-chooser”

Answer 1

假设您的意思是鼠标移动到任何地方，而不仅仅是在相关的 <div> 上移动申请 mousemove() 页面的事件处理程序:

var fadeout = null;
$("html").mousemove(function() {
  $("div.fadeobject").stop().fadeIn("slow");
  if (fadeout != null) {
    clearTimeout(fadeout);
  }
  fadeout = setTimeout(hide_playlist, 3000);
});

function hide_playlist() {
  $("div.fadeobject").stop().fadeOut("slow");
}

每次鼠标移动时，都会启动一个计时器，在三秒后淡出 div，并取消前一个计时器(如果有)。

注意:stop()这里不是严格必需的，但在处理多个动画/效果时建议使用。

编辑:修复了函数名称拼写错误并更新了 setTimeout 参数，以便超时调用有效。