如何根据内容动态设置fancybox2的高度？

Question

当内容很大时，如何增加fancybox2的动态高度。现在我把它设置如下

 $('.fancybox-wrap').width(810);
 $('.fancybox-wrap').height(450);
 $('.fancybox-inner').width(800);
 $('.fancybox-inner').height(450);
 $.fancybox.reposition();

如果内容很小，则上面有效。如果内容很大，我会得到垂直滚动条。宽度对我来说很好。只关注高度动态变化。

<div>
    <div class="col-sm-10 col-sm-offset-1" id="box_front_bottom" style="display: none;">
        <div class="panel panel-default">
           <div class="panel-heading text-center">
               <h2> <span class="text-center red">SPE Customer Services</span></h2>
               <span class="text-left">Thank you for contacting us!</span>
           </div>
           <div class="panel-body">
                  <div class="form-group">
                        <div class="col-sm-5">
                            @Html.Label("First Name", new { @class = "control-label" })
                        </div>
                        <div class="col-sm-7" id="formFirstName">

                        </div>
                    </div>
                     ---
                     ----
                 <div class="form-group">
                    <div class="col-sm-5">
                        @Html.Label("Description", new { @class = "control-label" })
                    </div>
                    <div class="col-sm-7" id="formDescription">
                    </div>
                </div>
           </div>
   </div>
</div>