jquery - 出现 animate is not a function 错误

Question

我有一个图像 slider ，并且我管理了这样的图像

+----------------------------------------------------------+
| +-----+ +------+ +------+ +------+ +------+ +----------+ |
| |     | |      | |      | |      | |      | |          | | visible images
| +-----+ +------+ +------+ +------+ +------+ +----------+ |
+----------------------------------------------------------+
  +-----+ +------+ +------+ +------+ +------+ +----------+  
  |     | |      | |      | |      | |      | |          | overflow hidden images
  +-----+ +------+ +------+ +------+ +------+ +----------+  

并且想要在 mouseover() 函数上对隐藏图像进行动画处理/淡入，如下所示

Demo

但是当我使用 firebug 时，它说 .animate() 不是一个函数。不管怎样，我在 fiddle 中注意到，当我将鼠标悬停在所有红色跨度上时，只有它的动画效果令人惊讶。

问题

如何为鼠标悬停的跨度设置动画而不将类放置在跨度内并像使用 nth-child 一样进行选择？

<小时/>

我只需要在鼠标悬停的一个跨度上设置 margin-top 。我还必须使用 fadeIn 效果。

updated demo//使用 float :左

Answer 1

这是你想做的吗？

$('div').mouseover(function(){
   //alert('hi');  //working
    $('span').animate({'margin-top':'-10px'},1000); 
});

编辑 - 从头开始​​，以下是您需要更改的内容:

span{
    background-color: red;
    height: 20px;
    width: 20px;
    display: block;
    float: left;
    border: 1px solid white;
}