javascript - Jquery .animate()... returns wrong offsets; -

in following code, if 1 of conditions true , run animate code, why both console.log return same values (offsets)?

$(document).on("click",".box",function(){             var transparent = $("#transparent");             var transparent_left = transparent.offset().left;             var transparent_top = transparent.offset().top;             var box = $(this);             var this_top = box.offset().top;             var this_left = box.offset().left;             console.log(this_top +" "+this_left);              if(transparent_top === (this_top + 100)             && transparent_left === this_left){                  box.finish().animate({top: "+=100"});                 transparent.finish().animate({top: "-=100"});             }else if(transparent_top === this_top             && transparent_left === (this_left + 100)){                  box.finish().animate({left: "+=100"});                 transparent.finish().animate({left: "-=100"});             }else if(transparent_top === this_top              && (transparent_left + 100) === this_left){                  box.finish().animate({left: "-=100"});                 transparent.finish().animate({left: "+=100"});             }else if((transparent_top + 100) === this_top             && transparent_left === this_left){                  box.finish().animate({top: "-=100"});                 transparent.finish().animate({top: "+=100"});             }              this_top = box.offset().top;             this_left = box.offset().left;             console.log(this_top +" "+this_left);          });