如何使用 jQuery 漂亮照片显示视频，并在单击时在灯箱中打开？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7061944/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to show a video, and open in a lightbox on click, with jQuery prettyPhoto?
提问by James
I am trying to use the prettyPhoto for jQuery to add a video to my website.
我正在尝试使用prettyPhoto for jQuery 将视频添加到我的网站。
I did add the jQuery source code and the prettyPhoto js location in my head, and before the end of my body tag, and I also added the initializing code (as said in the documentation).
我确实在我的脑海中添加了jQuery源代码和prettyPhoto js位置，在我的body标签结束之前，我还添加了初始化代码（如文档中所述）。
<script type="text/javascript" charset="utf-8">
$(document).ready(function(){
$("a[rel^='prettyPhoto']").prettyPhoto();
});
</script>
In my HTML, this is what I wrote because I wanted the video to show too, but when someone clicks on it the video should open as lightbox.
在我的 HTML 中，这就是我写的，因为我也希望视频显示，但是当有人点击它时，视频应该以灯箱形式打开。
<div id="video_player">
<a href="#" rel="prettyPhoto">
<iframe width="640" height="350" src="http://www.youtube.com/embed/cH6kxtzovew" frameborder="0" allowfullscreen></iframe>
</a>
</div>
But it's not working. How do I make this happen?
但它不起作用。我该如何做到这一点？
采纳答案by naveen
This is how you should do it
这是你应该做的
HTML
HTML
<div id="video_player">
<a href="http://www.youtube.com/watch?v=cH6kxtzovew" rel="prettyPhoto" title="My YouTube Video">
<img src="http://img.youtube.com/vi/cH6kxtzovew/default.jpg" alt="YouTube" width="50">
</a>
</div>
No need to change you JavaScript at all.
根本不需要改变你的 JavaScript。
Working Demo: http://jsfiddle.net/naveen/HU8zx/
Documentation: http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/
工作演示：http: //jsfiddle.net/naveen/HU8zx/
文档：http: //www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/documentation/
