Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100755 114 lines (96 sloc) 8.275 kB
689f641 Added default structure
Stephane Caron authored
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
2 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
3 <html>
4 <head>
5 <title>jQuery lightbox clone - prettyPhoto - by Stephane Caron</title>
6 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
7 <script src="http://www.google.com/jsapi" type="text/javascript"></script>
8 <script type="text/javascript" charset="utf-8">
9 google.load("jquery", "1.3");
10 </script>
11 <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="screen" title="prettyPhoto main stylesheet" charset="utf-8" />
12 <script src="js/jquery.prettyPhoto.js" type="text/javascript" charset="utf-8"></script>
13
14 <style type="text/css" media="screen">
15 * { margin: 0; padding: 0; }
16
17 body {
18 font: 62.5%/1.2 Arial, Verdana, Sans-Serif;
247b1c5 Fixed resize issue
Stephane Caron authored
19 padding: 0 20px;
689f641 Added default structure
Stephane Caron authored
20 }
21
247b1c5 Fixed resize issue
Stephane Caron authored
22 h4 { margin: 15px 0 5px 0; }
23
689f641 Added default structure
Stephane Caron authored
24 h4, p { font-size: 1.2em; }
25
26 ul li { display: inline; }
27 </style>
28 </head>
29 <body>
36ab095 prettyPhoto 2.5. Rewrote the code, created APIs, cleaned the CSS a lo…
Stephane Caron authored
30 <object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/zrdEHvREfdI&hl=en&fs=1&"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zrdEHvREfdI&hl=en&fs=1&" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
31
512daff Fixed a bug in the API when no titles/descriptions were provided
Stephane Caron authored
32 <h4>API calls</h4>
33 <p><a href="#" onclick="$.prettyPhoto.open('images/fullscreen/1.jpg');">No title, no description</a></p>
34
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
35 <h4>Gallery</h4>
689f641 Added default structure
Stephane Caron authored
36 <ul class="gallery clearfix">
37 <li><a href="images/fullscreen/1.jpg" rel="prettyPhoto[gallery1]" title="You can add caption to pictures."><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="Red round shape" /></a></li>
38 <li><a href="images/fullscreen/2.jpg" rel="prettyPhoto[gallery1]"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="Nice building" /></a></li>
39 <li><a href="images/fullscreen/3.jpg" rel="prettyPhoto[gallery1]"><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="Fire!" /></a></li>
40 <li><a href="images/fullscreen/4.jpg" rel="prettyPhoto[gallery1]"><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="Rock climbing" /></a></li>
41 <li><a href="images/fullscreen/5.jpg" rel="prettyPhoto[gallery1]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="Fly kite, fly!" /></a></li>
42 </ul>
43
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
44 <h4>Gallery 2</h4>
689f641 Added default structure
Stephane Caron authored
45 <ul class="gallery clearfix">
46 <li><a href="images/fullscreen/3.jpg" rel="prettyPhoto[gallery2]"><img src="images/thumbnails/t_3.jpg" width="60" height="60" alt="Lol" /></a></li>
47 <li><a href="images/fullscreen/4.jpg" rel="prettyPhoto[gallery2]"><img src="images/thumbnails/t_4.jpg" width="60" height="60" alt="" /></a></li>
48 <li><a href="images/fullscreen/5.jpg" rel="prettyPhoto[gallery2]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="" /></a></li>
49 <li><a href="images/fullscreen/1.jpg" rel="prettyPhoto[gallery2]"><img src="images/thumbnails/t_1.jpg" width="60" height="60" alt="" /></a></li>
50 <li><a href="images/fullscreen/2.jpg" rel="prettyPhoto[gallery2]"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="" /></a></li>
51 </ul>
52
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
53 <h4>Picture alone</h4>
689f641 Added default structure
Stephane Caron authored
54 <ul class="gallery clearfix">
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
55 <li><a href="images/fullscreen/2.jpg" rel="prettyPhoto" title="&lt;a href=&#x27;http://www.google.ca&#x27; target=&#x27;_blank&#x27; &gt;This will open Google.com in a new window&lt;/a&gt;"><img src="images/thumbnails/t_2.jpg" width="60" height="60" alt="Picture alone 1" /></a></li>
689f641 Added default structure
Stephane Caron authored
56 </ul>
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
57
58 <h4>Flash</h4>
689f641 Added default structure
Stephane Caron authored
59 <ul class="gallery clearfix">
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
60 <li><a href="http://www.adobe.com/products/flashplayer/include/marquee/design.swf?width=792&amp;height=294" rel="prettyPhoto[flash]" title="Flash 10 demo"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Flash 10 demo" /></a></li>
61 <li><a href="http://vimeo.com/moogaloop.swf?width=580&amp;height=326&amp;flashvars=clip_id=4321799&amp;server=vimeo.com&amp;show_title=1&amp;show_byline=1&amp;show_portrait=0&amp;color=&amp;fullscreen=1" rel="prettyPhoto[flash]" title="Vimeo Movie"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Vimeo movie" /></a></li>
bd19920 Added a classid for flash in the IEs
Stephane Caron authored
62 </ul>
63
64 <h4>Flash alone</h4>
65 <ul class="gallery clearfix">
66 <li><a href="http://www.adobe.com/products/flashplayer/include/marquee/design.swf?width=792&amp;height=294" rel="prettyPhoto" title="Flash 10 demo"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Flash 10 demo" /></a></li>
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
67 </ul>
68
8219013 YouTube support, percent based sized support, code optimization
Stephane Caron authored
69 <h4>Youtube video</h4>
70 <ul class="gallery clearfix">
71 <li><a href="http://www.youtube.com/watch?v=qqXi8WmQ_WM" rel="prettyPhoto" title="Flash 10 demo"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Flash 10 demo" /></a></li>
72 </ul>
73
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
74 <h4>Movies (.mov)</h4>
75 <ul class="gallery clearfix">
76 <li><a href="http://movies.apple.com/movies/wb/terminatorsalvation/terminatorsalvation-tlr3_h.480.mov?width=480&amp;height=204" rel="prettyPhoto[movies]" title="Terminator!"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Terminator Salvation" /></a></li>
77 <li><a href="http://movies.apple.com/movies/sony_pictures/angelsanddemons/angelsanddemons-video_h.480.mov?width=480&amp;height=260" rel="prettyPhoto[movies]" title="Angels &amp; Demons"><img src="http://images.apple.com/trailers/sony_pictures/images/angelsdemons_200903261218.jpg" alt="Angels &amp; Demons" /></a></li>
78 <li><a href="http://movies.apple.com/movies/magnolia_pictures/foodinc/foodinc_h.480.mov?width=480&amp;height=260" rel="prettyPhoto[movies]" title="Food, Inc."><img src="http://images.apple.com/trailers/magnolia/images/foodinc_200904171457.jpg" alt="Food, Inc." /></a></li>
689f641 Added default structure
Stephane Caron authored
79 </ul>
247b1c5 Fixed resize issue
Stephane Caron authored
80
bd19920 Added a classid for flash in the IEs
Stephane Caron authored
81 <h4>Movies (.mov) alone</h4>
82 <ul class="gallery clearfix">
83 <li><a href="http://movies.apple.com/movies/wb/terminatorsalvation/terminatorsalvation-tlr3_h.480.mov?width=480&amp;height=204" rel="prettyPhoto" title="Terminator!"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Terminator Salvation" /></a></li>
84 </ul>
85
247b1c5 Fixed resize issue
Stephane Caron authored
86 <h4>Unusual sizes</h4>
87 <ul class="gallery clearfix">
88 <li><a href="images/fullscreen/wide.gif" rel="prettyPhoto[unusual]">Wide image (3000 x 1500)</a></li>
89 <li><a href="images/fullscreen/high.gif" rel="prettyPhoto[unusual]">High image (1500 x 3000)</a></li>
90 <li><a href="images/fullscreen/huge.gif" rel="prettyPhoto[unusual]">Huge image (3000 x 3000)</a></li>
91 </ul>
92
4da2304 iframe support
Stephane Caron authored
93 <h4>Iframe</h4>
94 <ul class="gallery clearfix">
645618c Fixed IE6 theme fallback, fixed iframes parameters handling
Stephane Caron authored
95 <li><a href="http://www.google.com/search?ie=UTF-8&amp;oe=UTF-8&amp;q=prettyphoto&amp;iframe=true&amp;width=100%&amp;height=100%" rel="prettyPhoto[iframe]">Google.ca</a></li>
4da2304 iframe support
Stephane Caron authored
96 <li><a href="http://www.facebook.com?iframe=true&amp;width=600&amp;height=300" rel="prettyPhoto[iframe]">Facebook</a></li>
97 <li><a href="http://www.twitter.com?iframe=true&amp;width=300&amp;height=200" rel="prettyPhoto[iframe]">Twitter</a></li>
98 </ul>
99
8219013 YouTube support, percent based sized support, code optimization
Stephane Caron authored
100 <h4>Mixed gallery</h4>
101 <ul class="gallery clearfix">
102 <li><a href="http://www.google.ca?iframe=true&amp;width=1000&amp;height=500" rel="prettyPhoto[mixed]">Google.ca</a></li>
103 <li><a href="http://movies.apple.com/movies/sony_pictures/angelsanddemons/angelsanddemons-video_h.480.mov?width=480&amp;height=260" rel="prettyPhoto[mixed]" title="Angels &amp; Demons"><img src="http://images.apple.com/trailers/sony_pictures/images/angelsdemons_200903261218.jpg" alt="Angels &amp; Demons" /></a></li>
104 <li><a href="images/fullscreen/5.jpg" rel="prettyPhoto[mixed]"><img src="images/thumbnails/t_5.jpg" width="60" height="60" alt="" /></a></li>
105 <li><a href="http://www.adobe.com/products/flashplayer/include/marquee/design.swf?width=792&amp;height=294" rel="prettyPhoto[mixed]" title="Flash 10 demo"><img src="http://images.apple.com/trailers/wb/images/terminatorsalvation_200903131052.jpg" alt="Flash 10 demo" /></a></li>
106 </ul>
107
689f641 Added default structure
Stephane Caron authored
108 <script type="text/javascript" charset="utf-8">
109 $(document).ready(function(){
3db43c6 Support for flash, movies, tweaked the code
Stephane Caron authored
110 $(".gallery a[rel^='prettyPhoto']").prettyPhoto({theme:'dark_rounded'});
689f641 Added default structure
Stephane Caron authored
111 });
112 </script>
113 </body>
114 </html>
Something went wrong with that request. Please try again.