document.getElementById（＆＃39; nav＆＃39;）。style.width - 然后停止工作

Question

我尝试使用JavaScript，HTML，CSS进行基本的全屏菜单覆盖。

在我的HTML中我有：

<a href="" class="openBtn" onclick="openNav()">Open</a>

在我的app.js中：

$(document).foundation()

// Menu

function  openNav() {
  document.getElementById('nav').style.width = '100%';
}

当我点击＆＃39;打开＆＃39;时，菜单会显示并关闭。

Answer 1

尝试添加类

function  openNav() {
  document.getElementById('nav').classList.add('show');
}

然后在CSS中为该类添加样式

.show{
  width: 100%;
}