2012-07-24 106 views
0

定位加载指示div在我的aspx页面,我有3 td里面我已经放置 divs显示我的内容。我使用ajax加载数据在 每个div.in在我正在显示我的内容div 的同一td我也放置了一个div来显示加载指示器,当数据div 加载时。 我的问题是定位加载指示器div时,通过 不同的分辨率或屏幕尺寸的机器。 目前我的加载指标div是绝对类型的。 任何人都可以建议一个优雅的方法来定位我的加载 指标div在三个td的所以dat它正确居中 无论是什么是屏幕尺寸或分辨率。 我正在使用c#web应用程序。无论屏幕大小或分辨率

以下是TD的中的一个的标记,

<table width="100%" border="0" cellpadding="0" cellspacing="0" class="Box"> 
        <tr> 
         <td class="Box_TopLeftCurve"> 
          &nbsp; 
         </td> 
         <td valign="top" class="Box_TopRep"> 
         </td> 
         <td class="Box_TopRightCurve"> 
          &nbsp; 
         </td> 
        </tr> 
        <tr> 
         <td class="Box_LeftRep"> 
          &nbsp; 
         </td> 
         <td align="left" valign="top"> 
          <div class="Box_GridArea"> 
           Data Here 
          </div> 
          <div style="position: absolute; top: 347px; left: 207px; width: 134px;display:none;"> 
           Loading Indicator 
          </div> 
         </td> 
         <td class="Box_RightRep"> 
          &nbsp; 
         </td> 
        </tr> 
        <tr> 
         <td class="Box_BaseLeftCurve"> 
          &nbsp; 
         </td> 
         <td class="Box_BaseRep"> 
          &nbsp; 
         </td> 
         <td class="Box_BaseRightCurve"> 
          &nbsp; 
         </td> 
        </tr> 

+0

分享您的标记.. – 2012-07-24 08:05:33

+0

更新看看 – iJade 2012-07-24 08:21:28

+0

不使用位置绝对和删除的div左上角,只是只需使用加载DIV在那TDS – 2012-07-24 08:28:54

回答

0

显示指示器作为背景图像,使得它很容易在任何分辨率中心。

.loader { background: url('/images/loader.gif') center center no-repeat; } 

你可以将背景图像分配表中或者在它应该出现的TD。

加载时,你可以删除使用jQuery例如装载机类:

if (is_loaded) { 
    $('table td').removeClass('loader') 
}