jquery添加函数到动画队列导致动画并行执行

为什么这样的代码, 会让前两个动画并行执行? 百思不得其解...

$(function() {
    $('#btn').click(function(){
      $(".test").animate({width:'+=256'},2500);
      $(".test").animate({height:'+=256'},2500);
      $(".test").queue(function(){ 
          $(this).css({'backgroundColor':'black'});
          // $(this).dequeue(); //顺利执行
      });
      $(".test").dequeue();//会让前两个动画并行执行 
      $(".test").animate({width:'-=256'},2500);
      $(".test").animate({height:'-=256'},2500);
    });
  });