模拟速度条

最新推荐文章于 2024-09-16 23:05:35 发布

your568

最新推荐文章于 2024-09-16 23:05:35 发布

阅读量398

点赞数

分类专栏： asp.net 自写的文章标签： class div xhtml html javascript table

本文链接：https://blog.csdn.net/your568/article/details/1353161

版权

asp.net 自写的专栏收录该内容

5 篇文章 0 订阅

订阅专栏

首先要准备好一个HTML文件.我的如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script language="javascript">
function setPgb(pgbID, pgbValue)
{
     if ( pgbValue <= 100 )
     {
         if (lblObj = document.getElementById(pgbID+'_label'))
         {
              lblObj.innerHTML = pgbValue + '%'; // change the label value
         }
         if ( pgbObj = document.getElementById(pgbID) )
        {
              var divChild = pgbObj.children[0];
              pgbObj.children[0].style.width = pgbValue + "%";
         }
        window.status = "数据读取" + pgbValue + "%，请稍候...";
   }

     if ( pgbValue == 100 )
       window.status = "数据读取已经完成";
}
</script>
<html>
    <head>
         <style type="text/css">
         .bi-loading-status {
/*position:   absolute;*/
width:        150px;
padding: 1px;
overflow: hidden;
}
.bi-loading-status .text {
white-space: nowrap;
overflow:     hidden;
width:             100%;
text-overflow:     ellipsis;
padding:      1px;
}
.bi-loading-status .progress-bar {
border:       1px solid ThreeDShadow;
background:   window;
width:        100%;
padding: 1px;
overflow: hidden;
}
.bi-loading-status .progress-bar div {
background:   Highlight;
overflow: hidden;
height:       100%;
filter:       Alpha(Opacity=0, FinishOpacity=100, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=0);
}
</style>
     </head>
     <body bgColor="buttonface" topmargin="0" leftmargin="0">
          <table width="100%" height="100%" ID="Table1">
           <tr>
                 <td align="center" valign="middle">
                     <DIV class="bi-loading-status" id="proBar" style="DISPLAY: ; LEFT: 425px; TOP: 278px">
                            <DIV class="text" id="pgbMain_label" align="left"></DIV>
                            <DIV class="progress-bar" id="pgbMain" align="left">
                                 <DIV STYLE="WIDTH:10%"></DIV>
                            </DIV>
                       </DIV>
                   </td>
              </tr>
         </table>
     </body>
</html>

以下是代码

using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.IO;
using System.Threading;
public partial class progressbar : System.Web.UI.Page
{
    public void ThreadProc()
    {
        string strScript = "<script>setPgb('pgbMain','{0}');</script>";
        for (int i = 0; i <= 100; i++)
        {
            System.Threading.Thread.Sleep(10);
            Response.Write(string.Format(strScript, i));
            Response.Flush();
        }
    }
    protected void Page_Load(object sender, EventArgs e)
    {


    }

}