Как добавить overflow: hidden для body когда input:cheked?

Question

[havanaanavah]

Вот такой CSS

input,  ul.hamburger {
    display: none;
}
label {
    position: relative;
    display: block;
    cursor: pointer;
}
input:checked ~ ul.hamburger {
    display: block;
}
.burger {
position: fixed;
top:0;
left:0;
}
.fullscreen {
position: fixed;
background: #fff;
width: 100vw;
height: 100vh;
}

Вот такой HTML

<input  id="menu" type="checkbox" name="menu" />
<label class="burger" for="menu">иконка</label>
<ul class="fullscreen">
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
<li>Ссылка</li>
</ul>

Так реализована полноэкранная навигация. Нажимаешь на иконку - появляется меню.
Ссылок много, есть прокрутка. Как сделать, чтобы при клике на иконку добавилось overflow: hшdden для body, и прокрутка была соответственно только в меню?

Answer 1

[Dima Polos]

Только JS.