Javascript 我能'；我不明白为什么我的退出菜单动画不'；行不通

我正在为我的网站制作一份退出菜单。我的结果是：如果我点击图像，就会出现下拉菜单。我想要一个动画，所以我将高度设置为0px，并在javascript之后设置为“自动”。我还添加了一个0.3秒的动画。问题是我看不到动画。我希望有人能帮助我：）

HTML:

JAVASCRIPT

function dropMenuBar() {
    document.getElementById('dropMenuNavBar').style.height= 'auto';
}

---

您必须将

高度设置为100%。动画在
auto
设置上不起作用


var height=window.innerHeight；
函数dropMenuBar（）{
document.getElementById（'DropMenunaBar'）。style.height=height+'px'；
}
#下拉菜单栏{
宽度：100%；
身高：0；
背景颜色：黄色；
位置：固定；
z指数：50；
利润上限：70像素；
过渡：0.3s；
文本对齐：居中；
字体大小：40px；
溢出x：隐藏；
}


投资组合
关于我
接触

在CSS中：
#DropMenunaBar
（您忘记了
#
）。将
overflow-x
更改为
overflow-y
。在
后关闭div，否则图像也会被隐藏。然后将
'auto'
更改为固定高度，如
'230px'
，否则转换将不起作用。@Soccerlife单击图像时会出现动画。菜单正在向下滚动。谢谢，我现在看到了！唯一的小问题是，我的下拉菜单的高度在每个屏幕上都不一样，所以固定的高度并不是我想要的want@Soccerlife您可以始终使用javascript检查屏幕高度，然后设置菜单的高度。我已经编辑了我的帖子，请查看。@Soccerlife谢谢。干杯！：）
dropMenuNavBar {
    width: 100%;
    height: 0px;
    background-color: yellow;
    position: fixed;
    z-index: 50;
    margin-top: 70px;
    transition: 0.3s;
    text-align: center;
    font-size: 40px;
    overflow-x: hidden;
}

function dropMenuBar() {
    document.getElementById('dropMenuNavBar').style.height= 'auto';
}