< html xmlns="http://www.w3.org/1999/xhtml"> Xinda 電磁環境監視プラットフォーム <br> body { font-size: 12px; } <br> #n { margin:10px auto; width:920px; border: 1px Solid #CCC; フォントサイズ:14px; } <br> #n a { パディング:0 4px; <br> .Bar ,.Bars { 位置: 相対; */ ボーダー: 1px ソリッド #B1D632; } <br> .Bar div,.Bars div { 表示: ブロック; 背景:#00F;/* 進行状況バーの背景色: #333333; : 20px; /* 高さ */ line-height: 20px; /* テキストを垂直方向の中央に配置できるように、高さと一致する必要があります */ } .Bars div{ 背景:#090} <br> .Bar div span, .Bars div スパン { 位置: 絶対; 幅: 200px; /* 文字列: 中央; フォントの重み: 太字; } <br> < ;/style> <br> <script type="text/javascript"> <br> var NowImg=1;// 現在表示されている div を示します <br> // div の数を表します <br> for(var i= 1 ; i & lt; = maximg; i ++) {<br> if (nowimg == i) .style.display = 'div'; ).style.display = 'なし'; ‐ ‐ ‐ ‐ ‐ } <br> theTimer=setInterval("show()",1000);//タイマーを設定し、次の画面を表示 写真の場合、10000 は 10 秒ごとを意味し、変更可能です。 。 。 <br> </script> <br> <body> <br> <div class="cent"> p> <br> 周波数変更の進行状況: <br> </p> <br /> <p> <br> <div style="width: 2%;"> <span>33%</span> <br> </div> <br> </div> <br> </p> <br> </div> <br> <p>返下下<a href="http://www.divcss5.com/template/m411.shtml">CSS进度条</a></p> <br> </body> <br> <body onload="show()"> <br> <div> <br> <div id="div1" style="display:block;"><img src="http://chuantu.biz/t2/11/1438825741x-954497768.png" /></div> ; <br /> <div id="div2" style="display:none;"><img src="http://chuantu.biz/t2/11/1438825765x-954497768.png" /></div> ; <br /> <div id="div3" style="display:none;"><img src="http://chuantu.biz/t2/11/1438825794x-954497768.png" /></div> ; <br /> <div id="div4" style="display:none;"><img src="http://chuantu.biz/t2/11/1438825813x-954497768.png" /></div> ; <br /> <div id="div5" style="display:none;"><img src="http://chuantu.biz/t2/11/1438825832x-954497768.png" /></div> ; <br> </div> <br> </body> <br> </html> <br> </p> <p> </p> <br>回论论(解决方案)<h2> </h2>度条の原則は、現在追加されているダウンロードソースの数と全体のソースの数の比較を計算し、divの長さの比を設定します说总共有5个div加ダウンロード了四个 <p class="sougouAnswer"> 进度条就は 80% の長さ <br> <br> <div style="width:100px"> <br> <div id="progress" style="background:blue"></div> <br> </div> <br> その後、関数が「現在ロードされているソースの数と全体のソースの数の比」によって id の進行状況の div の長さを制御し、その効果が達成されます。 <br> 我改了好多遍,可及次回改変的時我的图就不有能态效果啦,故我是初学者但急用代,故以能帮我改下资料,谢谢您了 <br> </p> <div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="sycode" name="code"><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>信大电磁环境监测平台</title><style>body { font-size: 12px;}#n { margin: 10px auto; width: 920px; border: 1px solid #CCC; font-size: 14px; line-height: 30px;}#n a { padding: 0 4px; color: #333}.Bar,.Bars { position: relative; width: 200px; /* 宽度 */ border: 1px solid #B1D632; padding: 1px;}.Bar div,.Bars div { display: block; position: relative; background: #00F; /* 进度条背景颜色 */ color: #333333; height: 20px; /* 高度 */ line-height: 20px; /* 必须和高度一致,文本才能垂直居中 */}.Bars div { background: #090}.Bar div span,.Bars div span { position: absolute; width: 200px; /* 宽度 */ text-align: center; font-weight: bold;}.cent { margin: 0 auto; width: 300px; overflow: hidden}#status>div:not(:nth-of-type(1)){ display: none;}#btns{ text-align: center;} 频率变化进度: stop start 返回下载CSS进度条