Plyr - A simple, customizable HTML5 Video, Audio, YouTube and Vimeo player
Youtubeの動画を背景に
jQueryのtubularプラグインを使用してYOUTUBEの動画をブラウザの背景全体に再生させる（レスポンシブ対応）【jQuery連載01】 最近Webサイトでブラウザの背景全体に動画を配置してインパクトのあるサイトを見ることがありましたので、2回に分けて、YOUTUBEにアップロードした動画や自分のサーバー上の動画をvideo要素を使用して配置するサンプルを作成しました。 まず初回はYOUTUBEの動画を背景に表示させるjQueryの「tubular」プラグインを使用してインパクトのあるページが作れるサンプルです。 このプラグインでよく見かけるのはただ動画を背景に配置しただけのサンプルが多いので、今回はサイトのデザインとして使えるように、ロゴやナビゲーションやコンテンツ内容を入れてWebサイトのTOPページのデザインのようなサンプルを作成してみましたので、背景に動画を流したい場合にお
スクロールに合わせて静止画を切り替えるjQueryプラグイン – jQuery.mpic | JLINE.create();
スクロールに合わせて静止画を切り替えるjQueryプラグイン – jQuery.mpic 上記リンク先のサイトのような、スクロールに合わせて動画を再生するコンテンツを実装するjQueryプラグインを作りましたので公開します。動画とはいっても仕組みは上記サイトと同じく静止画を順番に切り替えるパラパラ漫画なのですが(‘A’;) さくっと使えるものではありませんがよろしければ。不具合などありましたら連絡いただけると嬉しいです。 デモ / ダウンロード 使い方 パラパラさせる静止画を用意する 動画を1フレームごとの静止画で用意します。スクロール時の表示に使う小さく軽量な画像と、スクロール停止時に表示する大きく綺麗な画像の二種類用意しておきましょう(前者のみでもプラグインは使用可能)。また、ファイル名はどちらも1から始まる通番を付けておいてください。参考になるかは分かりませんが私の場合の手順を以下に
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Loading...
