无论屏幕大小或分辨率

问题描述：

定位加载指示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>

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

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

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

答

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

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

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

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

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

无论屏幕大小或分辨率

相关推荐