案例展示地址1：https://www.jq22.com/yanshi255
案例展示地址（本人亲自完成）2：http://ymzxsp.hnmsgf.com/sancheng/
1 //插件描述：prettyPhoto是一个 jQuery全媒体灯箱插件。它不仅支持的图像，它还支持视频、 flash、 YouTube、 iframe 和 ajax。
prettyPhoto是一个 jQuery全媒体灯箱插件。它不仅支持的图像，它还支持视频、 flash、 YouTube、 iframe 和 ajax。如果你想要对其进行自定义，是很容易设置的，还非常灵活。再加上该脚本兼容所有浏览器。 它还配有用的 Api，所以几乎以可用在任何地方!
附：本地测试 案例代码
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 <script src="https://cdn.bootcdn.net/ajax/libs/jquery/1.8.3/jquery.js"></script> 7 <script src="https://cdn.bootcdn.net/ajax/libs/prettyPhoto/3.1.6/js/jquery.prettyPhoto.min.js" type="text/javascript"></script> 8 <link href="https://cdn.bootcdn.net/ajax/libs/prettyPhoto/3.1.6/css/prettyPhoto.min.css" rel="stylesheet" type="text/css" /> 9 <script type="text/javascript"> 10 $(document).ready(function() { 11 $("a[rel^=‘prettyPhoto‘]").prettyPhoto(); 12 }); 13 </script> 14 <style>.pp_social{display: none!important;}</style> 15 </head> 16 <body> 17 <a href="images/1.jpg" rel="prettyPhoto[pp_gal]" title="标题一."> 18 <img src="images/1.jpg" width="650" height="350" alt="" /></a> 19 <a href="images/2.jpg" rel="prettyPhoto[pp_gal]" title="标题二."> 20 <img src="images/2.jpg" width="650" height="350" alt="" /></a> 21 <a href="images/3.jpg" rel="prettyPhoto[pp_gal]" title="标题三."> 22 <img src="images/3.jpg" width="650" height="350" alt="" /></a> 23 <a href="images/4.jpg" rel="prettyPhoto[pp_gal]" title="标题四."> 24 <img src="images/4.jpg" width="650" height="350" alt="" /></a> 25 </body> 26 </html>