闪烁WebKit的

Question

动画汉堡菜单，当我动画汉堡菜单改变两个div（过渡）的margin和width，并在此期间，一个汉堡图标它是动画切换类is-active。

结果，你可以看到，在汉堡菜单（绿色区）内容的闪烁效应： http://www.codeply.com/go/g7Zp98paz5

执行汉堡按钮：你可以看到，对于一些毫秒，绿色区域消失。 执行切换按钮：您可以看到没有跳转。

我只在Google Chrome中复制它。

这是怎么回事？我该如何解决这个奇怪的行为？

我用这LIB：https://github.com/callmenick/Animating-Hamburger-Icons

Answer 1

这似乎是被什么东西做的旋转;评论他们使过渡正常工作：

/* active state, i.e. menu open */ 
.c-hamburger--htx.is-active span { 
    background: none; 
} 

.c-hamburger--htx.is-active span::before { 
    top: 0; 
    /*transform: rotate(45deg);*/ 
} 

.c-hamburger--htx.is-active span::after { 
    bottom: 0; 
/* transform: rotate(-45deg);*/ 
}