jquery は進行状況バーの効果を実装します。ここでは実際的な効果はありませんが、フロントエンドがその進行状況効果を実現する方法の一部を実装しています。 効果のデモンストレーション: プログレスバー実装ソース コード: コードをコピーコードは次のとおりです: jquery 実装進行状況バー<br> .progressBar{幅:200px;高さ:8px;ボーダー:1px ソリッド #98AFB7;ボーダー半径:5px;マージントップ:10px;}<br> #bar{幅:0px;高さ:8px;ボーダー半径:5px;背景: # 5EC4EA;}<br><br> function progressBar(){<br> //js プログレスバーを初期化します<br> $("#bar").css("width","0px");<br> //進行状況 バーの速度。小さいほど速くなります。 <br> var Speed = 20;<br><br> bar = setInterval(function(){<br> nowWidth = parseInt($("#bar").width( )); <br> //幅は進行状況バーの合計幅を超えてはなりません<br> if(nowWidth barWidth = (nowWidth 1) "px";<br> $ ("#bar").css ("width",barWidth);<br> }else{<br> //プログレスバーがいっぱいになったら停止<br> clearInterval(bar);<br> } <br> } ,speed);<br> } <br>