jQuery现在越来越被重视,相当多的web2.0网站在采用它来展示其照片库。jQuery效果能够模拟出Flash的效果将一组照片相当优雅地展示在读者面前。下面我们将为大家介绍14个顶级的jQuery效果。你喜欢的话,可以拿去用在你自己网站的相册上。
[separator]Galleria – Galleria 是一个用js写的相册,算是一个jQuery插件了。它用一段简洁的html代码将照片以画布的形式展开,同时还为你的照片生成缩略图。Galleria的界面非常友好,你不需要懂得太多代码编写的知识就可以非常容易地使用它。点击这里看看Galleria的演示效果。
jQuery Multimedia Portfolio – 是一个很酷的jQuery插件,它可以将你的照片非常流畅地横向排列出来。更妙的是,它支持多种媒体格式,照片、flv视频甚至MP3音频都可以被它识别出来。jQuery Multimedia Portfolio会主动判断文件的后缀格式,如果是音频或者视频的话,这个插件可以为其生成一个截图,并将这个截图与其他的照片和谐地排列在一起。图示为该插件的预览,详细演示请点击此处。
Space Gallery – 动态地3维展示你的图片,效果看上去像苹果的时空机器一样,很炫!点击这里看详细演示。
jQuery Slider Gallery – 像苹果网页上展示其产品那样,移动滑动块,你希望展示的图片就会随着横向移动。
jQuery jsGallscroll Plugin – jQuery Gallery Scroller (jqGalScroll)能够制作出带分页的照片展示效果。你可以非常流畅地通过点击按照顺序切换照片,也可以自己点击分页选择你的目标图片。你可以用这个插件让照片按照水平、垂直或者斜角的方式来切换。
jQuery Cycle Plugin – 是一个轻量级的幻灯显示插件,要实现它的效果,你需要先安装Torsten Baldes写的InnerFade Plugin,Matt Oakes的Slideshow Plugin和Benjamin Sterling的jqShuffle Plugin这三个插件。jQuery Cycle Plugin支持鼠标悬停,自动停止,自适应大小,点击触发,渐隐渐现等多种图片切换特效。jQuery Cycle Plugin还支持Metadata Plugin 和 the Easing Plugin这两个插件(可选)。
EO Gallery – 是一个网页幻灯效果。它基于最基本的jQuery和Cody Lindley 的 Thickbox的功能在网页上展示大尺寸图像。EO Gallery符合XHTML 1.0和CSS设计标准。我在Firefox、IE6.0、Safari上测试过EO Gallery,表现很好。它甚至还能在不支持javascript 和 CSS的浏览器上工作,无敌了!
slideViewer – 它能根据你的照片张数生成一个页码表附在幻灯片的底部,每个页码对应一张图片,你可通过点击页码轻松切换图片。
jQuery lightbox plugin – 这个相信大家已经都见识过了,该插件的灵感发源于Lokesh Dhakar的LightBox JS。使用这个插件将让你的网页图片已非常优雅轻灵的方式展现在读者面前。
Galleriffic – 这个jQuery插件为你的照片生成一个精致的缩略图列表,点击缩略图就可以快速查看适当尺寸的预览图了。同时它还提供了原始尺寸图片的下载方式,我觉得用这个插件来制作相册的效果非常好。
pirobox -Diego Valobra提供的又一个JS相册脚本。点这里,看看它到底有什么不一样。
jQuery Popeye – 这个插件提供了一个随机展示内嵌图像的脚本。它放大图片的技巧相当聪明。网页设计者无需为放大后的图像专门写一个层,放大后的图像仍旧自然流畅还不影响网页上其余内容的布局。这对访问者的体验度是很有帮助的。点击这里看演示。
zoomimage – 这个插件的效果相当时髦还特别体贴。点击缩略图,大图将在内置的弹出窗口中展示,放大后的图像带着一层淡淡的投影和边框,美观极了。点击这里看演示及说明。
Dynamic Image Gallery and Slideshow – 这是一个轻量级的相册与幻灯js脚本,总共才3K大小,别看它体积小,它的功能可是相当强大的哦。点击这里看演示。
这个效果也不错 http://www.pirolab.it/pirobox/
还有这个:http://sandbox.leigeber.com/slideshow/
还有这个:http://ennuidesign.com/demo/contentslider/#
这个真的很不错:http://www.jumpeyecomponents.com/Flash-Components/User-Interface/JC-Play-List-285/examples.htm
这个做美图首页可以吗:http://cssglobe.com/lab/easyslider1.5/04.html