Javascriptで下記URLのようなシークバーを作成したいです。


http://www.smart-lab.jp/?p=717

上記のシークバーでは進行状況は表示されますが、再生位置を移動することはできません。
これを移動できるようにするにはどうしたらいいでしょうか。

HTML5ではなく、通常のHTMLでの記述を詳しく教えてください。

回答の条件
  • 1人5回まで
  • 13歳以上
  • 登録:2011/06/05 12:43:46
  • 終了:2011/06/12 12:45:03

回答(3件)

id:dothan No.1

どたん回答回数145ベストアンサー獲得回数252011/06/05 13:17:30

HTML5でシークバー付きの動画を配信したいというご質問ですね?

videoタグで動画を埋め込む」が参考になります。

id:muggy0812

参考URLはHTML5のものですが、最後に書いたようにHTML5ではない通常のHTMLでの記述を知りたいです・・・

2011/06/05 13:23:15
id:dothan No.2

どたん回答回数145ベストアンサー獲得回数252011/06/05 14:36:19

ポイント100pt

No.1の者です。失礼しました。


Video LightBoxをお試しください。

id:Cherenkov No.3

Cherenkov回答回数1502ベストアンサー獲得回数4922011/06/05 17:56:56

ポイント100pt

リンク先のようなvideo要素にHTML5を使わず再生位置を移動することはできません。

video要素に対応したブラウザならば標準でcontrols(シークバー)を付けることが出来ます。

なぜHTML5はダメなのでしょうか。この条件によって回答の幅を狭めているので理由を書いたほうがいいかと。

jquery video シークバー でググってデザインをカスタムできるプラグインを見つけるかそのまま使ったほうがいいと思います。


youtubeなどAPIが提供されているものならば、クロムレスプレーヤーにしてjQuery UI - Slider などでスライダーにclickイベントに結びつければシークバーを実装することができます。

サンプル:

設置サンプル

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

絞り込み :
はてなココの「ともだち」を表示します。
回答リクエストを送信したユーザーはいません