颜色框未调整到正确的高度

Question

我正在尝试将内联HTML加载到一个颜色框中，该颜色框运行良好，只是颜色框没有调整到正确的高度。

内联HTML内容的高度很长（约15000像素），但只加载了900像素。

所以我开始使用colorbox.resize（）函数来解决这个问题，例如：

        $('.inline-html').colorbox({ 
            onComplete : function() { 
               $(this).colorbox.resize(); 
            }    
        });

但调整大小功能只能工作到大约11000像素（而不是所需的15000像素）。但是，如果我刷新页面两次，它会加载全部15000像素。

有人能提出解决方案吗？

感谢

Answer 1

想法：

1. 我看到过这种情况，当onComplete启动时，颜色框中有未加载的图像，因此颜色框的大小调整为内容的高度减去图像。然后加载图像并创建滚动条。如果可以为卸载的图像设置高度，问题可能会消失，因为colorbox会立即知道它的大小。例如：

   <p>Really long content.</p>
   <p>Really long content.</p>
   <img src="image.jpg" height="300">
   <p>Really long content.</p>
   

---

2. 如果你知道颜色框将是15000像素，你能在css中将颜色框设置为那么高吗？还是运行$.colorbox.resize({height:"15,000"})

---

3. 可能是最糟糕的选择，你可以在超时后调整它的大小，给图像加载时间。这是不可靠的，因为不同的人会在不同的时间加载图像，但如果问题出在图像上，这可能有助于解决问题。

   window.setTimeout($.colorbox.resize(), 500);