jquery - Mobile menu's jerky sliding animation -


when viewing my page (login = "mmt" | pass = "mmt_nv2014") viewport width below 1068px or on mobile phone, hamburger icon (top left) opens menu sliding left via code:

$( '#mobile_left_menu_icon' ).click(function() {     if( $('#mobile_left_menu').css('left') == '-280px' ) {          $( "#mobile_left_menu" ).animate( { left: "0" }, open_delay, 'easeinoutexpo' );          $( "#wrapper" ).animate({ left: "280px" }, open_delay, 'easeinoutexpo' );         $( "#mobile_top_menu" ).animate({ left: "280px" }, open_delay, 'easeinoutexpo' );         $( 'body' ).addclass( 'overflow_hidden' );     }     else {          $( "#mobile_left_menu" ).animate({ left: "-280px" }, close_delay, 'easeinoutexpo' );         $( "#wrapper" ).animate({ left: "0" }, close_delay, 'easeinoutexpo' );           $( "#mobile_top_menu" ).animate({ left: "0" }, close_delay, 'easeinoutexpo' );           $( 'body' ).removeclass( 'overflow_hidden' );     } }); 

for reason though, animation feels quite jerky on smartphone compared other website similar sliding menu. why that?

try adding

-webkit-backface-visibility: hidden; -webkit-perspective: 1000; 

i recommend adding set height menu helps flicker while transitioning.


Comments

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

python - How to create jsonb index using GIN on SQLAlchemy? -

c# - TransactionScope not rolling back although no complete() is called -