菜單打開時如何禁止正文滾動

Question

菜單打開時如何禁止正文滾動？ 我試過使用下面的代碼，但沒有成功。

function openNav() { 
    document.getElementsByTagName("body").style.overlay = "hidden"; document.getElementById("mySidenav").style.height = "50%"; }

function closeNav() { 
    document.getElementById("mySidenav").style.height = "0"; 
}

Answer 1

document.getElementsByTagName("body").classList.add('hidden');

body.hidden {
  overflow: hidden;
}

Answer 2

將此添加到菜單將阻止后面的正文滾動。

body.menu-open {
    overflow: hidden;
}

文檔溢出