jquery - JQuery：mousemove 淡入/淡出元素

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 参数，因此超时调用有效。

Answer 2

我正在使用它并且效果很好：

$(document).ready(function() {
    $('.elementClass').fadeTo(0, '0.5').hover(function() {
        $(this).fadeTo(500, 1);
    }, function() {
        $(this).fadeTo(350, '0.8');
    });
});

Answer 3

看看这个

Jquery：当鼠标空闲时如何使某些东西淡出。当鼠标再次移动时，它会淡入！