I am trying to create 3D transition & animation for the sidemenu in Ionic 3 similar to the following:
see a live demo here: https://codepen.io/jdnichollsc/pen/zqwVwz (using ionic 1).
I am trying to do the same animations and transitions with ionic 3.
I tried using CSS transform and translate3d similar to the link above.
transform: translate3d(275px, 0px, 0px) scale(.9) !important; opacity: 0.9; -webkit-filter: blur(2px); filter: blur(2px); transform-origin: center center;
but that didn’t work as expect, the sidemenu when opened will use regular ionic transition and when fully opened it will do the translate3d
I even tried looking at the source code of both ion-nav, ion-menu, and ion-toolbar (one of them is causing the normal translate2d behavior, I wanted to override that but didn’t really figure out where is its logic).