我一直在努力理解和调整这里发布的漂亮的“粘糊糊的菜单”......
http://codepen.io/lbebber/pen/pvwZJp
我最近尝试将垂直/矩形菜单放在这里...
http://codepen.io/d3wannabe/pen/EVwEBE
但我有一个问题，我真的很难解决 - 当你在第二个链接（我的一个）中使用下拉菜单时，在扩展初始动画后，整个菜单略微向左跳（而在崩溃它跳回到右边）。如果你看一下css（scss）我没有应用任何x位置变换/翻译，所以我无法弄清楚可能导致它的原因。
我唯一有点怀疑的代码是因为我不完全理解它是......
.menu-open:checked~.menu-item{
transition-timing-function:cubic-bezier(0.165, 0.840, 0.440, 1.000);
但它仍然听起来纯粹与任何过渡适用的时间间隔相关，而不是x坐标的变化。
感谢您对可能导致这种不必要的跳跃的任何想法！
答案 0 :(得分：1)
在您的Codepen中，当显示子项时，它会导致正文页面高度发生变化并且溢出。
然后显示一个垂直滚动条，页面宽度也会改变。
默认情况下只需添加滚动条
body {
overflow-y: scroll;
}
如果您将 原始Codepen中的布局视图更改为垂直选项，则可以看到没有显示滚动条（至少在我的显示器上）。