15个非常棒的jQuery灯箱脚本
fmms 13年前
<br /> Lightbox 应该是最流行的图片浏览效果了,常具有功能包括:自动根据窗口的大小缩放图片,模式窗口,幻灯片方式播放,内容预加载,渐变等效果。Web开发者们模仿 Lightbox 开发了各种各样的图片浏览插件,有基于 jQuery 的,有基于 Prototype 的,也有使用原生 JavaScript 写的。今天,本文要与大家分享的是15个 jQuery Lightbox 效果插件。 <br /> <h3>1)<a href="/misc/goto?guid=4958188365554939871"> Fancybox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188365554939871"><img class="aligncenter size-full wp-image-1495" title="my_fancybox1" alt="" src="https://simg.open-open.com/show/1738a8f7521d09a35082e8f85f0423e3.jpg" width="500" height="296" /></a></p> <h3>2)<a href="/misc/goto?guid=4958188367022851474"> Lightview</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188367022851474"><img class="aligncenter size-full wp-image-1496" title="my_Lightview" alt="" src="https://simg.open-open.com/show/93365534073df2d4c50e3238c42a3c67.png" width="550" height="272" /></a></p> <h3>3) <a href="/misc/goto?guid=4958188368442186139">GMAPs overlay</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188368442186139"><img class="aligncenter size-full wp-image-1497" title="my_GMapsOverlay" alt="" src="https://simg.open-open.com/show/5ccb579a26fc565de259e1d1b52b3900.png" width="550" height="268" /></a></p> <h3>4)<a href="/misc/goto?guid=4958188369837089779"> Thicbox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188369837089779"><img class="aligncenter size-full wp-image-1498" title="my_ThickBox " alt="" src="https://simg.open-open.com/show/05e6c2cefd0e791418216b40cae46b61.png" width="550" height="272" /></a></p> <h3>5)<a href="/misc/goto?guid=4958188371247775898"> Slightly Thickerbox 1.7</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188371247775898"><img class="aligncenter size-full wp-image-1499" title="my_Slightly ThickerBox 1.7" alt="" src="https://simg.open-open.com/show/ff055158e504c0d139f47f0c3056d32b.png" width="550" height="272" /></a></p> <h3>6)<a href="/misc/goto?guid=4958188372665160269"> Greybox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188372665160269"><img class="aligncenter size-full wp-image-1500" title="my_ GreyBox" alt="" src="https://simg.open-open.com/show/dd61cfc6bb12d17bed08679868b123c4.png" width="550" height="272" /></a></p> <h3>7)<a href="/misc/goto?guid=4958188374082745411"> Fancy Zoom</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188374819505738"><img class="aligncenter size-full wp-image-1501" title="my_Fancy Zoom " alt="" src="https://simg.open-open.com/show/a05b9a52af34511dc5e97b28bf743fb2.png" width="550" height="272" /></a></p> <h3>8 )<a href="/misc/goto?guid=4958188375562840741"> Facebox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188375562840741"><img class="aligncenter size-full wp-image-1502" title="my_Facebox " alt="" src="https://simg.open-open.com/show/7840dff93bb6032c5f97b4a305f8ccad.png" width="550" height="272" /></a></p> <h3>9)<a href="/misc/goto?guid=4958184280087566697"> Pretty Photo</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958184280087566697"><img class="aligncenter size-full wp-image-1503" title="my_lightbox" alt="" src="http://static.open-open.com/news/uploadImg/20110831/jQuery-lightbox-for-images-videos-油Tube-iframes-ajax-St%C3%A9phane-Caron-%E2%80%93-No-Margin-For-Errors_1310220018545-e1310220078727.png" width="550" height="271" /></a></p> <h3>10)<a href="/misc/goto?guid=4958188378326619272"> Pirobox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188378326619272"><img class="aligncenter size-full wp-image-1504" title="my_Pirobox" alt="" src="https://simg.open-open.com/show/2f9d0e123c4f9eb1ba7a1c13e854cc9b.png" width="550" height="271" /></a></p> <h3>11)<a href="/misc/goto?guid=4958188379738292491"> Interface Imagebox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188379738292491"><img class="aligncenter size-full wp-image-1505" title="my_Interface" alt="" src="https://simg.open-open.com/show/f32bbdec46b00d88b54b6a800cd41b72.png" width="550" height="264" /></a></p> <h3>12)<a href="/misc/goto?guid=4958188381137564835"> Shadowbox</a></h3> <p><a href="/misc/goto?guid=4958188381137564835"><img class="aligncenter size-full wp-image-1506" title="my_Shadowbox" alt="" src="https://simg.open-open.com/show/8335d63132fbe892656c987404a9b276.png" width="550" height="271" /></a></p> <h3>13) <a href="/misc/goto?guid=4958188382559804556">Litebox</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188382559804556"><img class="aligncenter size-full wp-image-1507" title="my_Litebox " alt="" src="https://simg.open-open.com/show/e9429383bb45b4398f6c502c961795c0.png" width="550" height="271" /></a></p> <h3>14)<a href="/misc/goto?guid=4958188383971593504"> Lightbox Image Viewer</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188383971593504"><img class="aligncenter size-full wp-image-1508" title="my_image" alt="" src="https://simg.open-open.com/show/cfad286aef5720ad71967d89de1b2499.png" width="550" height="271" /></a></p> <h3>15)<a href="/misc/goto?guid=4958188385385958732"> Thumbnail</a></h3> <p style="text-align:center;"><a href="/misc/goto?guid=4958188385385958732"><img class="aligncenter size-full wp-image-1509" title="my_image45454" alt="" src="https://simg.open-open.com/show/94573769c3eb7181b2bf48edc09202a8.png" width="550" height="271" /></a></p> <br />