VideoBoxでyoutubeの埋め込みをポップアップ表示させる方法
2024/01/13
youtubeの埋め込みリンクをLightboxみたいにポップアップ表示させる方法が知りたかった。調べてみるとVideoBoxというプラグインが簡単そうだったのでメモ。
VideoBox(ダウンロード先)
http://sourceforge.net/projects/videobox-lb/files/videobox/videobox%201.1/
ソース
<html> <head> <title>videoboxのテスト</title> <script type="text/javascript" src="./video/js/mootools.js"></script> <script type="text/javascript" src="./video/js/swfobject.js"></script> <script type="text/javascript" src="./video/js/videobox.js"></script> <link rel="stylesheet" href="./video/css/videobox.css" type="text/css"> </head> <body> <h1>videoboxのテスト</h1> <div style="height:100%;"> <a href="http://www.youtube.com/watch?v=Er9JOhUZ2Ek" rel="vidbox 600 450" title="youtube"> クリックでポップアップ </a> </div> </body> </html>
その他
relのところでheightとweightを決められるみたい。あとdivにheight:100%をつけないとサンプルみたいにコンテンツが少ない場合は、全画面が暗転しなかった。
関連記事
Lightbox.jsでCSP(コンテンツセキュリティポリシー)エラーが発生した際の対応方法
CSP(コンテンツセキュリティポリシー)設定を行っているサーバーでLightbo ...
Lightboxで文字をクリックしたら画像を表示させる方法
Lightboxを使用する際、一般的に使われているのはサムネイル画像をクリックす ...
Lightboxで画像拡大時に閉じるボタンの位置を右上に変更
Lightbox(バージョン2.7.1)で画像拡大時に閉じるボタンの位置を右下か ...