動画も対象のLightbox系javascript「Mediabox」

このエントリーを含むはてなブックマーク はてなブックマークを見るこの記事をクリップ! コメントを見るYahoo!ブックマークに登録 このエントリーをdel.icio.usに追加するこのページを行き先登録 このページをniftyクリップに登録このページをBuzzurlに登録

Web2.0の象徴といえば画像をクールに表示できる「Lightbox」があります。
しかしLightboxでは画像のみが対象でした。
MediaboxはフラッシュはもちろんYouTubeなどの動画サイト、iflameまで表示できます。
mooMediabox

使用方法
Mediaboxからダウンロードしたmediabox64.jsとmediabox.css、さらにmootools.jsをダウンロードします。
<link rel="stylesheet" href="http://yourdomain/mediabox.css" type="text/css" media="screen">
<script src="http://yourdomain/mootools.js" type="text/javascript"></script>

<script src="http://yourdomain/mediabox64.js" type="text/javascript"></script>

*swf形式を対象とする場合はswfobject.jsも必要になるようです。
最後に対象となるファイルを以下のよう指定すれば完成です。
<a href="対象URI" rel="mediabox[width height]">リンクテキスト</a>
動画も対象のLightbox系javascript「Mediabox」サンプル

2007年09月10日

前の記事:Dockメニューを実現するjavascript「iconDock」
次の記事:右クリックのオリジナルメニューを作成するjavascript「jQuery Halo Context Menu」

関連記事

コメント投稿











コメント一覧

Mediaboxを使ってみましたが・・・

はじめまして。
Mediaboxを使ってみましたが、mediabox64.jsが見つからず、mediabox68.jsをDLしたのですが、FLVが再生出来ませんでした。なんか足りないのでしょうか?

また、映像が表示される黒バックの右下に「クローズ」の画像が用事されません。マウスはききます。
画像もmediaboximagesホルダをDLしたのですが、設定と配置位置を教えていただけますか?

posted by: ウェブハウス at 2008年4月10日 08:45

コメントありがとうございます。
なにか足りないと言われても状況を見てみないとなんともいえないです。。。
取り急ぎ、mediabox64.jsを下記からダウンロードしてみてはいかがでしょうか?
http://www.skuare.net/test/js/mediabox64.js

posted by: skuare.net Author Profile Page at 2008年4月11日 22:10

この記事へのトラックバック:

過去の記事

rss

ページトップに戻る