Javascript 如何向div添加上/下滑动效果？

我正在使用

asp.net mvc5

和

razor引擎

。我想在div中添加

向上滑动

和

向下滑动

效果。我今天花了很多时间做这件事，但我做不到。我使用了很多jquery代码，但都不起作用。我不知道为什么Jquery在我的项目中不起作用。我很困惑。请帮助我如何在此代码中添加

向上滑动

向下滑动

效果？这是我的密码：

<script type="text/javascript">
    var button = document.getElementById('btnShow');
    button.onmouseover = function () {
    var div = document.getElementById('MyFooter');
    div.style.display = 'block';
  };
</script>

<script type="text/javascript">
    var button = document.getElementById('btnHide');
    button.onmouseover = function () {
    var div = document.getElementById('MyFooter');
    div.style.display = 'none';
          };
</script>

var button=document.getElementById（'btnShow'）；
button.onmouseover=函数（）{
var div=document.getElementById（'MyFooter'）；
div.style.display='block'；
};
var button=document.getElementById（'btnHide'）；
button.onmouseover=函数（）{
var div=document.getElementById（'MyFooter'）；
div.style.display='none'；
};

---

谢谢。

使用

jQuery

您可以像下面这样做。此代码段可能会对您有所帮助

$（'#btnShow'）.mouseover（函数（）{
$（“#我的页脚”）.slideDown（）；
});
$（'#btnHide'）.mouseover（函数（）{
$（'#MyFooter'）.slideUp（）；
});
#我的页脚{
高度：200px；
宽度：200px；
边框：1px实心#000；
显示：无；
}




谢谢，但它没有起作用，就像我今天尝试的许多代码一样：（如果你正确地添加了
jquery
库，这必须起作用。哇，非常感谢。
slide-up
很好。但是
slide-down
不起作用。顺便说一句，非常感谢你如果
slideUp
起作用，那么
slideDown
应该起作用。你可能拼写错误
jquery
选择器。我写的代码和你的一模一样。）我不知道为什么其中一个不起作用：/