Question

在某些网站上我看到了这种效果：如果我悬停一些菜单背景颜色不会立即改变，但它会在某个特定时间发生变化，看起来它是动画，我怎么能得到这种效果？

Answer 1

这可以通过css3 transition（不使用javascript）轻松完成，也可以通过旧浏览器上的特定属性进行动画

a {
   color: 000;
   -webkit-transition: color 2s;
   -msie-transition: color 2s;
   -moz-transition: color 2s;
   -o-transition: color 2s;
   transition: color 2s;
}

a:hover {
   color: #ccc; 
}

Answer 2

您想要了解的是 CSS过渡效果。 Googled Results

看看这个基本的jsFiddle当你悬停时，背景颜色渐渐变为红色。

CSS

div{ 
    background-color: blue;
    -webkit-transition: background-color 1000ms linear;
     -moz-transition: background-color 1000ms linear;
     -o-transition: background-color 1000ms linear;
     -ms-transition: background-color 1000ms linear;
     transition: background-color 1000ms linear;
}

Answer 3

这可能就是你要找的东西

$("div").hover(function () {
      $(this).effect("highlight", {}, 3000);
});

Answer 4

您可以使用javascript“setTimeout”函数为效果添加延迟..类似

使用jquery悬停事件的伪代码：

.... .hover(function() {

      //on mouseover
      setTimeout(FunctionThatDoesSomethingCool(), 3000); //3000 = delay/milliseconds
},
function() {
       //mouseout
}
}); //end hover event

Answer 5

我认为你想要的是一个像这样的插件，所以看看：hoverintent

Answer 6

$(selector).mouseover(function(){
 // change color   
}).delay('time');

jquery悬停菜单随时间添加类

6 个答案: