Customized Top Menu Animation Issues

I wanted to make the side menu come down from the top instead of left/right, so I did a css animation override to do so. I also disabled the drag-content so you wouldn’t get it going left and right.

This all works fine and dandy on a web browser, but as soon as you load it into the phone or have any memory issues, when you go to close the menu, it slides out right before sliding back up.

Any idea how to disable that default animation? I’ve put the example in a code pen