如何停止移动导航上“闪烁”的 CSS 过渡

Question

我创建了一个Codpen Pen 来显示我遇到的问题。当您将浏览器的大小调整为媒体查询时，在这种情况下

问题是第 28 行的转换：

@include transition(all .25s linear);

如果我删除该行，它会解决所有问题，但会删除违背移动导航目的的过渡（它将流畅的导航变成我不想要的笨重的东西）。我怎样才能解决这个问题？我已经试过了：

-webkit-transform-style: preserve-3d;
-webkit-backface-visibility: hidden;
-webkit-perspective: 1000;

如果有任何帮助，我将不胜感激！

Answer 1

演示 - http://codepen.io/anon/pen/vEXaVP

不要使用transform:translateX，而是使用left

.sliding-menu-content {
    left:-220px;
}

&.is-visible {
    left:0px;
}