動画のポップアップLightbox「Video Lightning」
当ページのリンクには広告が含まれています。
スポンサーリンク
動画のポップアップLightboxを簡単にサイトへ設置するjQueryプラグイン「Video Lightning」を紹介します。
jQueryプラグイン「Video Lightning」
このプラグインの特徴は、「YouTube」や「Vimeo」といった動画のポップアップLightboxを簡単に設置できることです。
クリックアクションで、動画のLightboxがポップアップされ、同時に背景は暗くなり、動画がはじまります。まるで、自分のサイトが映画館のように……ちょっと言い過ぎましたが……便利なプラグインです。
スポンサーリンク
デモのテキストリンク「YouTube」をクリックすると動画Lightboxがポップアップされます。試してみてください。
デモのソース(HTML + jQuery)
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>jQuery Video Lightnings - jQueryプラグインまとめのカルマ</title>
<link rel="stylesheet" href="jquery-video-lightning.css">
</head>
<body>
<h1>jQuery Video Lightningsのデモでーす。</h1>
<p>クリック! → <span class="video-link" data-video-id="y-HttdxjYK7EQ">Youtube</span></p>
<script src="http://code.jquery.com/jquery-2.0.0.js"></script>
<script src="jquery-video-lightning.js"></script>
<script>
$(function() {
$(".video-link").jqueryVideoLightning({
autoplay: 1,
color: "white"
});
});
</script>
</body>
</html>
jsファイルのダウンロード、その他のオプション詳細はこちらからどうぞ。
» Video Lightning
スポンサーリンク