Question

我有以下结构，＃tarbs div是一个静态定位div。我想在ajax请求期间显示加载内部div并将其置于#tabs div（实际上是jquery选项卡）的中心。但它并没有集中在我现在拥有的CSS。

<div class="span-18 last" id="top_tab_container">
  <div id="loading">
    <div id="loading_inner">
      Loading...
    </div>
  </div>
  <div class="normal-pad  ui-widget-content ui-tabs ui-widget ui-corner-all" id="tabs">
    <ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all">
      <li class="ui-state-default ui-corner-top ui-tabs-selected ui-state-active"><a href="#tabs-1">Most Voted</a></li>
        <li class="ui-state-default ui-corner-top"><a href="#tabs2" title="tabs2"><span>Near You xxxx</span></a></li>
        <li class="ui-state-default ui-corner-top"><a href="#tabs3" title="tabs3"><span>You are Tracking</span></a></li>
      <li class="ui-state-default ui-corner-top"><a href="#tabs4" title="tabs4"><span>Most Tracked</span></a></li>
    </ul>
    <div id="tabs-1" class="ui-tabs-panel ui-widget-content ui-corner-bottom">

    </div><div id="tabs2" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide"></div>

      <div id="tabs-2">
      </div>
      <div id="tabs3" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
        <div id="tracked_posts"></div>
      </div>

    <div id="tabs4" class="ui-tabs-panel ui-widget-content ui-corner-bottom ui-tabs-hide">
      <div id="most_tracked_"></div>
    </div>
  </div>
</div>

#loading_inner {
    background:transparent url(/images/loading_big.gif) no-repeat scroll center center;
    font-size:16px;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
    height:100px;
    left:50%;
    line-height:normal;
    margin-left:-50px;
    margin-top:-50px;
    overflow:auto;
    padding:10px;
    position:fixed;
    text-align:center;
    top:50%;
    width:100px;
    z-index:2;
}

Answer 1

改变立场：固定;位置：绝对; 并添加：#top_tab_container {position：relative; }

是你的意思吗？

中心加载叠加div

1 个答案: