jQuery图像在Colorbox上调整大小

Question

我试图找出为什么我的colorbox弹出窗口在第一次加载时不会自动调整大小，但是在第二次尝试时它会自动调整大小。

这是截图

    <script type="text/javascript">
      ResizePopUp = function () {
        var frameWidth = jQuery(".imgPopUpContainer").width();
        var frameHeight = jQuery(".imgPopUpContainer").height();
        try {
          parent.jQuery.fn.colorbox.resize({ innerHeight: frameHeight, innerWidth: frameWidth });
        } catch (e) { }
      };
      jQuery( document ).ready(function() {
        ResizePopUp();
      });
    </script>

我正在使用colorbox http://www.jacklmoore.com/colorbox/

你知道男人们在这里遇到什么问题吗？

Answer 1

有可能是jQuery（＆＃34; .imgPopUpContainer＆＃34;）。width（）;和高度尚不可用。

您可以通过添加短暂超时来测试此理论：

  jQuery(document).ready(function() {
    window.setTimeout(function(){
      ResizePopUp();
    }, 3000);
  });

如果是这种情况，您可以使用像http://imagesloaded.desandro.com这样的库来查看图像是否在调用height（）和width（）之前已加载。

Answer 2

你可能想在$（window）.load事件处理程序而不是$（document）.ready处理程序中调用你的ResizePopUp()函数..你的DOM可能已准备就绪，但内容的其余部分（图像，iframe等）可能不是......

来源：http://learn.jquery.com/using-jquery-core/document-ready/