How to remove the animation when resize Windows?

Example: https://jsfiddle.net/xt5q505y/

The essence of the following:

There is a menu when the width of the window in pixels 768 I'm getting the right transform, then click on the Burger it went. All would be great, but to effect the desired transitions, with him goes smoothly. When resize menu also floats left to right, as first the panels need to move to position (100%,0)

transform: translate(100%,0);
transition: transform .6s ease-in-out, -webkit-transform .6s ease-in-out;

How to overcome it? Need to socket went there and back just by clicking on the Burger (assign class and change the transform), but resize window to swim.

screen and (max-width: 768px) {

.mmenu {
padding: 80px 0;
z-index: 400;
position: fixed;
top: 0;
right: 0;
transform: translate(100%,0);
transition: transform .6s ease-in-out, -webkit-transform .6s ease-in-out;
display:flex;
flex-direction:column;
justify-content: center;
align-items: center;
justify-content: space-around;
background:#26303b;
height:100%;
width:100%;
}

}
June 14th 19 at 19:21
0 answer

Find more questions by tags CSS