javascript - jquery函数不显示动画

Question

我创建了两个函数，可以将它们用于不同的 CSS 类。

    var CSSElement;
$(document).ready(function(){  


  expandBox (".orange");
  minimizeBox(".orange");

});

function expandBox ($CSSElement){
     //When mouse rolls over  
    $($CSSElement).mouseover(function(){  
        $(this).stop().animate({height:'485px'},{queue:false, duration:600, easing: 'easeOutBounce'})  
    });     
}

function minimizeBox ($CSSElement){
     //When mouse is removed  
    $(CSSElement).mouseout(function(){  
        $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})  
    }); 
}

但是，似乎只有函数 expandBox 起作用。如果我将鼠标悬停在远离 .orange 元素的地方，则框不会收缩。

我希望这些动画显示为功能，因为我计划在我的网站中使用它们几次。如果我把我的代码如下:

$(document).ready(function(){  

   //When mouse rolls over  
    $($CSSElement).mouseover(function(){  
        $(this).stop().animate({height:'485px'},{queue:false, duration:600, easing: 'easeOutBounce'})  
    });  

  //When mouse is removed  
    $(CSSElement).mouseout(function(){  
        $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'})  
    }); 

});

一切似乎都正常。第一个代码不起作用但第二个代码起作用的原因是什么？

谢谢，

乌纳亚克

Answer 1

我猜你打错了:

$($CSSElement)

$(CSSElement)

这就是为什么它不起作用