如何扩展div以覆盖较小屏幕上的视频，并使下拉菜单响应？

@media screen and (max-width: 600px) {
  .video-container {
    position: relative;
  }
  
  .video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
  }
}

<div class="menu">
  <button class="menu-toggle">菜单</button>
  <ul class="menu-items">
    <li>菜单项1</li>
    <li>菜单项2</li>
    <li>菜单项3</li>
  </ul>
</div>

<script>
  const menuToggle = document.querySelector('.menu-toggle');
  const menuItems = document.querySelector('.menu-items');
  
  menuToggle.addEventListener('click', function() {
    menuItems.classList.toggle('show');
  });
</script>