If statement 简化jQuery-简单

我并不擅长编译java，但这是我能想到的最好的方法：

我只是想简化以下脚本：

$('#about')
  .hover(function() {
    $('#bg_mask').stop().animate({ "height": "100px", }, '1500');
  }, function() {
    $('#bg_mask').stop().animate({ "height": "40px", }, '1500');
  });

$('#blog')
  .hover(function() {
    $('#bg_mask').stop().animate({ "height": "180px", }, '1500');
  }, function() {
    $('#bg_mask').stop().animate({ "height": "40px", },'1500');
  });
$('#contact')
  .hover(function() {
    $('#bg_mask').stop().animate({ "height": "250px", }, '1500');
  }, function() {
    $('#bg_mask').stop().animate({ "height": "40px", },'1500');
  });

我确信有一个if和else语句可以用来总结/简化我正在做的事情

基本上这就是我想要的：

如果将鼠标悬停在#about then->动画宽度：x上， 如果将鼠标悬停在#blog上，然后->动画宽度：xx， 等等等等， else if->动画宽度：40px

我很想学习，所以即使你不愿意编译代码，我也会非常棒，即使你只是给我指出了正确的方向

干杯。

功能流程（id，高度）{
$（“#”+id）.悬停（函数（）{
$（'#bg_mask'）.stop（）.animate（{“height”：height+“px”，}，“1500”）；
}，函数（）{
$（'bg_mask'）.stop（）.animate（{“height”：“40px”，“1500”）；
});
}
过程（“约”，100）；
过程（“博客”，100）；
过程（“联系”，250）；

好的，这里有一个版本，不需要任何额外的代码，在每个代码中循环，并根据粗略的数学给它们一个动画

$('#menu_wrapper div:not(#bg_mask)').each(function(i) {
    $(this).data('animID',i-1);
    $(this).hover(function() {           
        $('#bg_mask').stop().animate({ "height": ((($(this).data('animID')*80)+100)-10)+"px" }, '1500');
      }, 
      function() {
            $('#bg_mask').stop().animate({ "height": "40px" },'1500');
      });
});

​

---

Jquery不是java，而是javascript，这是一个巨大的区别。感谢您的输入。我会记下来的。嗯，我确实回答了Holy smokes@Riateche，这比我想象的还要好。谢谢你的意见！非常感谢