前の記事 ≪:2011年4月4日 管理人のブックマーク
次の記事 ≫:手書きのアナログ感が印象的な247のアイコンセット

Youtube動画埋込みを独自デザインにしたい場合に使えるjQueryプラグイン「Custom Youtube Player」

2011年04月05日-はてなブックマーク

スポンサード リンク
[PR] 英単語を忘却曲線アプリを使って超効率よく記憶する方法
Custom YouTube Player Reload ? Scripts and Code

Youtube動画埋込みを独自デザインにしたい場合に使えるjQueryプラグイン「Custom Youtube Player」
Youtubeの通常のembedタグを埋めこむと、再生ボタンやらなにやらが付いていたりしますが、次のように、再生ボタンなしに出来ます。
これだけでも、デザインされたサイトには馴染みそうですね。バーがあるとデザイン全体が台なしというケースもありそう。



更に、カーソルを合わせると次のようにカスタマイズされたコントロールバーが現れます。



このコントロールバーは、JavaScript + CSS + 画像でデザインされており、ファイルをいじれば好きにカスタマイズすることも可能です。



サイトに動画を埋め込みたい、でも一目見ただけで、Youtubeとわかるあのインタフェースはちょっと・・・、という方はこちらを試してみるとよさそうですね。

JavaScript と CSSさえいじってしまえば、あとは、 $(element).customYtPlayer() ってやるだけで初期化が完了します。

また、こちらのチュートリアルでもカスタマイズ方法について触れられています。動画の上にオーバーレイしている再生ボタンもカスタマイズ出来るみたいです。



関連エントリ
関連の記事検索:jQuery, youtube, YouTube, Web制作
スポンサード リンク

By.KJ : 2011年04月05日 09:02 livedoor Readerで購読 Twitterに投稿

間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)