Javascript jquery css_jquery で書かれたシンプルなプログレス バー コントロール

優れた CSS を使用すると、非常に美しい進行状況バーのスタイルを実現できます。 Javascript の効果と組み合わせることで、ユーザーを完全に「騙し」、ブラウザーが処理を完了するまで辛抱強く待つことができます。上記の原則を理解したので、コードを直接見ることができます。このような短いコードの方が理解しやすいため、私は今でも jQuery フレームワークを使用しています。

もちろん、このコントロールにはまだやるべきことがたくさんありますが、私は Web 標準に準拠した実装のアイデアを提供しているだけです。これ以上ナンセンスはありません。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>JavaScript プログレスバーのデモ - jb51.net</title> <style type="text/css"> #progress {background: white; height: 20px; padding: 2px; border: 1px solid green; margin: 2px;} #progress span {background: green; height: 16px; text-align: center; padding: 1px; margin: 1px; display: block; color: yellow; font-weight: bold; font-size: 14px; width: 0%;} </style> <h1> </h1> <p>JavaScript プログレスバーのデモ<a href="http://www.jb51.net/article/13993.htm"> </a>原則として、Javascript を使用して SPAN CSS (およびその他のスタイル) の幅を制御します。詳細については、リンクを参照してください: </p>http://www.jb51.net/article/13993.htm<div id="progress"><span> </span></div>
[Ctrl A すべて選択 注:

外部 Js を導入する必要がある場合は、更新して実行する必要があります
]