Menu delay question after modification


#1

Hi,

Does anybody can help me find out why is a delay when I open/close the menu.
I made some modification to make the menu 3d-ish, but now it’s slower than before.

Here is an example:

Here is my modification:

.menu-content {
    -o-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -webkit-transform: none !important;

    -webkit-transition: all 200ms linear !important;
    -moz-transition: all 200ms linear !important;
    -ms-transition: all 200ms linear !important;
    -o-transition: all 200ms linear !important;
    transition: all 200ms linear !important;
    -webkit-backface-visibility: hidden !important;
}

.menu-content-open {
    -webkit-transform: translate3d(270px,0,0) scale(0.75) !important;
    -moz-transform: translate3d(270px,0,0) scale(0.75) !important;
    -ms-transform: translate3d(270px,0,0) scale(0.75) !important;
    transform: translate3d(270px,0,0) scale(0.75) !important;
}

#2

Nice modification.

What delay exactly?


#3

When you press the open button. Roughly 1 sec. Just remove the additional css and compare with it.
In that case when you press it, opens immediately.


#4

Please provide both as Plunkrs so we can compare without additional work.


#5

Ther you go:


#6

Interesting.

The opening delay seems to be caused by

    -o-transform: none !important;
    -moz-transform: none !important;
    -ms-transform: none !important;
    -webkit-transform: none !important;

#7

Yeah, but in this case, it goes right first (original) and after down (my animation). It much worst.