Jquery colorbox在过度等待后显示文本

我在一个颜色框中有一个隐藏div的页面，我在点击链接时会显示该页面。颜色盒工作得很好，但显示出来大约需要8秒钟。我不做任何后端查询，我只显示现有的隐藏文本和更改样式。我用open:true实例化了colorbox，这似乎没有任何效果。有什么想法吗？这是我的密码：

<script>
  jQuery(document).ready(function() {
    jQuery('.colorbox').colorbox({
      width: '50%', 
      open: true, 
      left: '2%'
    });

    jQuery('.colorbox').bind('cbox_complete', function() {
      jQuery('#colorbox').addClass("colorbox_opened");
    });

    jQuery('.colorbox').bind('cbox_closed', function() {
      jQuery('#colorbox').removeClass("colorbox_opened");
    });

    jQuery('#cboxClose').bind('cbox_load', function() {
      jQuery('#cboxClose').hide();
    });

    jQuery('#cboxClose').bind('cbox_complete', function() {
      jQuery('#cboxClose').show();
    });

  });

</script>

HTML如下所示：

<div id="colorbox" class="colorbox_opened" style="display: block; padding-bottom: 30px; padding-right: 0px; top: 0px; left: 33px; position: absolute; width: 818px; height: 239px;">
  <div id="cboxWrapper" style="height: 269px; width: 818px;">
    <div>
      <div id="cboxTopLeft" style="float: left;"></div>
      <div id="cboxTopCenter" style="float: left; width: 818px;"></div>
      <div id="cboxTopRight" style="float: left;"></div>
    </div>
    <div style="clear: left;">
      <div id="cboxMiddleLeft" style="float: left; height: 239px;"></div>
      <div id="cboxContent" style="float: left; width: 818px; height: 239px;">
      <div id="cboxLoadedContent" style="display: block; width: 818px; overflow: auto; height: 239px;">
        <h1>FAQ</h1>
        <div id="faq_show">
          <h3>Question</h3>
          <div class="question"> My question text </div>
          <h3>Answer</h3>
          <div class="answer"> My answer text </div>
          <div>
            <a href="/setup/faqs/11/edit">Edit</a>
          </div>
        </div>
      </div>
      <div id="cboxLoadingOverlay" style="float: left; display: none;"></div>
      <div id="cboxLoadingGraphic" style="float: left; display: none;"></div>
      <div id="cboxTitle" style="float: left; display: block;"></div>
      <div id="cboxCurrent" style="float: left; display: none;"></div>
      <div id="cboxNext" style="float: left; display: none;"></div>
      <div id="cboxPrevious" style="float: left; display: none;"></div>
      <div id="cboxSlideshow" style="float: left; display: none;"></div>
      <div id="cboxClose" style="float: left;">close</div>
    </div>
    <div id="cboxMiddleRight" style="float: left; height: 239px;"></div>
  </div>

---

您是否已选中此处的颜色框示例：

查看源代码时，您会注意到所有回调都直接插入到colorbox init中，如下所示：

$(".callbacks").colorbox({
                onOpen:function(){
                     alert('onOpen: colorbox is about to open');
                     },
                onLoad:function(){
                     alert('onLoad: colorbox has started to load the 
                     targeted content'); },
                onComplete:function(){
                     alert('onComplete: colorbox has displayed
                     the loaded content'); },
                onCleanup:function(){
                     alert('onCleanup: colorbox has begun the close process'); },
                onClosed:function(){
                     alert('onClosed: colorbox has completely
               closed');
               }
});

我想，如果你只是以它为例，调整功能以满足你的需求，会更容易