Jquery slideDown not working right away

Question

This is click function that search area will be slide down right under header. I made this with jQuery slideDown. But I can see that slideDown function is not working right away, It seem like waiting 1 second then slide down.

It is not a big problem, but this is bother me.

Is there any solution?

or this is just how slideDown function work?

Below is my code for reference:

 /*header function*/ function showHeaderSearch_PC() { $('.search_area').slideDown(260); $('#search_btn_pc').fadeOut(150, function(){ $('#search_close_btn_pc').fadeIn(150); }); } function hideHeaderSearch_PC() { $('.search_area').slideUp(260); $('#search_close_btn_pc').fadeOut(150, function(){ $('#search_btn_pc').fadeIn(150); }); } function showHeaderAllMenu() { $('.all_menu_area').slideDown(400); $('#all_menu_btn').fadeOut(150, function(){ $('#all_menu_close_btn').fadeIn(150); }); } function hideHeaderAllMenu() { $('.all_menu_area').slideUp(400); $('#all_menu_close_btn').fadeOut(150, function(){ $('#all_menu_btn').fadeIn(150); }); } $(function(){//PC header search function $('#search_btn_pc').click(function(){ hideHeaderAllMenu(); setTimeout(function(){ showHeaderSearch_PC();}, 400); }); $('#search_close_btn_pc').click(function(){ hideHeaderSearch_PC(); }); }); $(function(){//PC header all menu function $('#all_menu_btn').click(function(){ hideHeaderSearch_PC(); setTimeout(function(){ showHeaderAllMenu();}, 270); }); $('#all_menu_close_btn').click(function(){ hideHeaderAllMenu(); }); }); 

Answer 1

I believe, you are using "slideDown" function with some value such as slideDown(500);

If you don't pass any value like slideDown() , it would slide down immediately