Puzzles on the length of the effect queue after a certain animation is finished

Puzzles on the length of the effect queue after a certain animation is finished

Hello guys, need ur help.

jQuery version:2.1.4

example:
  1. <!DOCTYPE html>
    <html>
    <head>
      <style>
  2.       div { margin:3px; width:40px; height:40px;
                 position:absolute; left:0px; top:60px;
                 background:green; display:none; }
          div.newcolor { background:blue; }
          p { color:red; } 
  3.    </style>

    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

  5. <script>
  6. $(document).ready(function(){
  7. var div = $("div");

  8. function runIt() {
      div.show("slow");
      div.animate({left:'+=200'},2000,showIt);  //length of the queue is 7, when jquery version is 2.1.4
      div.slideToggle(1000);
      div.slideToggle("fast");
      div.animate({left:'-=200'},1500);
      div.hide("slow");
      div.show(1200);
      div.slideUp("normal");
    }

  9. function showIt() {
      var n = div.queue("fx");
      $("span").text( n.length );
    }

    runIt();
    </script>

  10. </head>

    <body>

    <p>length of the effect queue is：<span></span></p>
    <div></div>
    </body>
    </html>

Problem description:
Why the return value of showIt function  is 7 in above example?
As I know, showIt function in above example is executed after the finishing of the first animate method. Since the first animate functino is not in the queue anymore, i think the return value of the showIt function in above example should be 6. But the running result of above code showed a return value of 7. What's wrong? WHy?

PS: in the lower version of jquery such as jQuery 1.6.1, the return value of showIt function in above example is 6. So could anybody tell me?


Tks very much.