OBSで操作できる進捗バー

OBS上（対話ウィンドウ）で増減を操作できる進捗表示バーです。

作業配信の進捗を可視化するのに作りました。…いや、作ってもらいました。

シンプルな進捗バーと泡のアニメーションがついた進捗バーの２種類です。

OBSのソースに「ブラウザ」を追加して、ローカルファイルでダウンロードしたHTMLを選択してください。

『幅650』『高さ150』で登録すると全体が見えると思います。

追加したブラウザソースを右クリックして『対話(操作)』で出てくるウィンドウで増減の操作ができます。

操作説明　　※ 対話ウィンドウをアクティブにしてね！

Alt (Option)キー＋上下矢印キー：ざっくり増減

　　Controlキー＋上下矢印キー：ちょっぴり増減

デフォルトでは進捗のパーセンテージが一定より多くなったり少なくなったりすると色が変わるようにしています。

画像の通り、赤→オレンジ→緑→金で推移します。

CSSとjavascriptでできているので、割となんでもカスタムできます。

キー・色・増減量等を変更してご利用ください。

カスタム用の説明はある程度HTML内に記載しています。

なお、サポートはChatGPTにしてもらってください。

なぜなら、ほとんどChatGPTが作ったものだからです。

利用規約

このツール（およびカスタムしたツール）を販売しないでください。

転載はやむをえない時だけにしてください。

それ以外はなんでもいいです。