Html 上下滑动底部菜单CSS

我很难找到解决我想做的事情的方法。我找到的任何教程都做得太多或太复杂

我想制作一个向上滑动的底部菜单，当它向下时有一些文本，如果你点击文本/链接，css ID将改变并出现。我刚刚开始钻研动态网页的世界

HTML

<div id="foot"> <font color="white">Down</font>

---

这就是你想要的吗？后院里的神马，我真傻！

#foot {
position: fixed;
bottom:0px;
width: 99.1%;
height: 30%;
background-color: black;
text-align: center;
}
\/ When the menu is down
#footdown {
position: fixed;
bottom:0px;
width: 99.1%;
height: 4%;
background-color: black;
text-align: center;
}