帮我编写一个网页侧边的悬浮栏，其中包含快递寄送，快递查询，以及联系我们，要求可以实现展开和收起的功能

好的，以下是一个简单的实现方案：

HTML部分：

<div class="floating-menu">
  <div class="menu-toggle">
    <i class="fas fa-bars"></i>
  </div>
  <ul class="menu-items">
    <li><a href="#">快递寄送</a></li>
    <li><a href="#">快递查询</a></li>
    <li><a href="#">联系我们</a></li>
  </ul>
</div>

CSS部分：

.floating-menu {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  background-color: #fff;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
  z-index: 999;
}

.menu-toggle {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  cursor: pointer;
}

.menu-toggle i {
  font-size: 20px;
}

.menu-items {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-in-out;
}

.menu-items li {
  padding: 10px;
}

.menu-items li a {
  display: block;
  color: #333;
  text-decoration: none;
}

.is-open .menu-items {
  max-height: 200px;
}

JavaScript部分：

const toggleBtn = document.querySelector('.menu-toggle');
const menuItems = document.querySelector('.menu-items');

toggleBtn.addEventListener('click', function () {
  menuItems.classList.toggle('is-open');
});

以上代码实现了一个简单的悬浮栏，其中包含一个菜单按钮和一个菜单项列表。菜单项列表默认为折叠状态，点击菜单按钮可以展开和收起菜单项列表。你可以根据自己的需求来进一步美化和完善这个悬浮栏。