fancyBox彈出iframe頁面其實非常簡單，這里簡單說一下。主要說的問題是關于控制彈出的iframe頁面高度的問題。

代碼如下：

<script language="javascript" type="text/javascript" src="/styles/jquery-1.7.2.min.js" ></script>
<script language="javascript" type="text/javascript" src="/styles/fancyBox/jquery.fancybox.js"></script>

<script type="text/javascript">
$(document).ready(function() {
 $('.fancybox').fancybox({
  padding : 0,
  autoScale:true,
  width:350,
  height:180,
  openEffect: 'elastic'
 });
});
</script>

<a href="tanchu.html" class="fancybox fancybox.iframe"><img src="/images/btn_enroll_2.png" width="73" height="28" /></a>

看代碼寬度已經在js的屬性中設置過了，但是卻發現高度的設置經常是無效的。

經過測試，發現在彈出的tanchu.html頁面設置div寬度和高度能夠解決這個問題：

tanchu.html代碼

<div style="width:300px; height:180px; padding: 15px;" style="color:#000; background:#fff;">
內容
</div>

讓fancybox設置的寬度高度和div一致就可以了。