jquery动画增长和缩小问题

Question

我已经创建了一个基本的html网站，并且我有一个按钮，其中一个使得J查询方块（<div id="ccal" style="background:#2E2EFE;height:150px;width:150px;">）更大（id =“ccalicon”）而另一个按钮（id =“ccalmax”）让它变得更大。

第一个按钮

$("#ccalicon").click(function(){
  $("#ccal").animate({width:500,height:300},"slow");
});

然而，当我点击第二个按钮时，我想让它变大，但它会再次增长和缩小（宽度：50，高度：300）！

$("#ccalmax").click(function(){
$("#ccal").animate({width:700,height:700},"slow");
});

任何人都可以对此有所了解以及为什么会发生这种情况以及我应该采取哪些措施来阻止它再次萎缩？
谢谢，