<progress> - 進捗状況

トップ > HTMLリファレンス > <progress>

概要

形式
<progress>~</progress>
サポート
LS / H5 / e10 / Ch6 / Fx6 / Sa5.2 / Op11
カテゴリ
フローコンテンツ
フレージングコンテンツ
ラベラブル
パルパブルコンテンツ
親要素
フレージングコンテンツ を子要素に持てるもの
子要素
フレージングコンテンツ (progress要素を子孫に持つことはできない)
タグの省略
開始タグ:必須 / 終了タグ:必須
属性
グローバル属性
value
max

説明

progress は進捗状況を示します。最大値を max とした現在の値 value を棒グラフなどで表します。

<progress>~</progress> の間には、<progress> に対応していないブラウザのためのメッセージや代替内容などを記述します。

属性

グローバル属性
詳細は グローバル属性 を参照してください。
max=n
LS/H5/e/Ch/Fx/Sa/Op
最大値を指定します。
value=n
LS/H5/e/Ch/Fx/Sa/Op
現在の値を指定します。

使用例

HTML
<script>
window.onload = function() {
    window.setInterval(function() {
        var o = document.getElementById('prog1');
        if (o.value == 100) {
            o.value = 0;
        } else {
            o.value += 10;
        }
    }, 200);
};
</script>
<progress id="prog1" max=100 value=0></progress>
表示

リンク


Copyright (C) 2011-2017 杜甫々
初版:2011年6月11日 最終更新:2017年12月31日
http://www.tohoho-web.com/html/progress.htm