Bigegg Lab

2011年 4月 5日

Custom YouTube Player Reload ? Scripts and Code

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



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



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



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

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

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



関連エントリ

• YoutubeのAPIをPHPから簡単に使える「PHPTube」
• 再生ボタン等も変更できちゃうYoutube操作jQueryプラグイン「jQuery Youtube Player」
• YoutubeやUstream等の動画埋め込みが超簡単になるjQueryプラグイン「jquery.mb.mediaEmbedder」

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

実は、ニコニコ動画も初期はこのようなAPIを組み合わせてyoutube上に字幕を流していました。

1年前 | 固定リンク | 2011年 4月 5日 |

2010年 8月 7日

「条件分岐編」、「デザイン編」の2回にわけて、Flash軽量化について解説されています。

条件分岐編では、if文の条件を見直して容量を削減するテクニックが述べられています。
「<=」は「<」より容量を食うので使わないなど、かなり涙ぐましい努力が見て取れます。

デザイン編では、素材の画像の加工方法や、使用するフォントについて触れられています。

ベクターデータのフォントは角ばったフォントを使ったほうが容量が少ないとのことです。
原理を考えれば当たり前のことなのですが、これは気にしたことが無かったです。
また「2」と「5」を反転で使いまわせるというメリットもあるようです。

ケータイ向けFlashと容量削減は切っても切れない関係なので、Flashの制作をされている方はチェックしてみてはいかがでしょうか。

Flash Liteの容量削減テクニックをまとめて記事「知らないと損をするよ！ 携帯Flash軽量化メモ」 | ke-tai.org

1年前 | 固定リンク | 2010年 8月 7日 |