浏览器打造超炫网页图片浏览效果

豆豆网   技术应用频道   2008年02月18日  【字号: 收藏本文

内容摘要:面对图片共享网站和图片搜索网站,如何也像浏览本地图片一样,使用幻灯的效果呢?本文将介绍两种应用扩展插件的方法,来实现酷炫的网页图片浏览,该插件支持的浏览器包含了Firefox(Windows,Mac)、IE、Safari(Mac)、Opera,相信会适合大多数读者的。

  浏览本地图片除了Windows自带的工具外,我们还可以选择ACDSee、XnView等。那么面对图片共享网站和图片搜索网站,如何也像浏览本地图片一样,使用幻灯的效果呢?本文将介绍两种应用扩展插件的方法,来实现酷炫的网页图片浏览,该插件支持的浏览器包含了Firefox(Windows,Mac)、IE、Safari(Mac)、Opera,相信会适合大多数读者的。

  一、效果超炫的PicLens

  PicLens能够使浏览器使用全屏的3D效果浏览网络图片。目前支持的网站有:

  ·图片分享网站Flickr,Smugmug,DeviantArt,Photobucket和Picasa;

  ·社交网站Facebook,MySpace,Bebo,Hi5和Friendster;

  ·图片搜索Google,Yahoo(不包括中国雅虎),Ask和AOL;

  ·图片RSS。

  Firefox扩展PicLens的下载地址:https://addons.mozilla.org/zh-CN/firefox/addon/5579

  安装后,进入到该扩展支持的网页,当鼠标移动到图片上时,就会在右下角显示一个播放按钮,点击就可以进入全屏的3D画廊效果。也可以点击浏览器窗口右上方的按钮进入。

浏览器打造超炫网页图片浏览效果

  图1 两种进入的选择

  在画廊效果下,可以按住鼠标,来拖动翻页,也可以使用下面控制栏的滚动条。鼠标滚轮控制缩放。

浏览器打造超炫网页图片浏览效果

  图2 进入后为画廊模式

  单击一张图片,将会放大。双击,或者单击工具栏左侧的按钮,将在单张图片的幻灯浏览模式和画廊模式间切换。使用方向键,“翻页”按钮,或滚轮,实现翻页。

浏览器打造超炫网页图片浏览效果

  图3 单张的幻灯模式

  3D的画廊,半透明的工具栏,够炫吧?

  IE版PicLens下载地址:http://www.piclens.com/ie/download/piclensIE_1517.msi

  Safari版PicLens下载地址:http://www.piclens.com/safari/download/piclens_1516.zip

  二、小巧的js脚本Lightbox

  java脚本Lightbox能增强在Google图片搜索、Flickr、维基百科、Facebook和deviantART中的图片浏览效果。可以在如下浏览器中使用:

  ·Firefox(需要Greasemonkey扩展)

  ·Safari(需要GreaseKit)

  ·Opera

  下载地址:http://shiftingpixel.com/downloads/greasedlightbox.user.js

  本文将以Opera为例介绍该脚本的使用(如果你懂得js脚本在Opera的使用,请跳过下一段)

  首先,任意创建一个文件夹,以保存js脚本,例如“D:Program FilesOperajs”。打开“工具——首选项”,进入“高级——内容”,点击“JavaScript选项”,选择“用户JavaScript文件”的路径,即为刚才创建的文件夹。

浏览器打造超炫网页图片浏览效果

  图4 选择js的路径

  重启Opera后,进入该脚本支持的页面,点击某张图片,就能显示原图(非缩略图)。使用左右方向键,能够切换上一张/下一张。

浏览器打造超炫网页图片浏览效果

  图5 浏览效果

  总结:PicLens支持的网站数目要超过Lightbox,推荐大家应用。而Lightbox在效果显示上还不如PicLens。但是,这种豪华效果将会牺牲系统资源占用为代价的。如果你的浏览器同时支持这两种工具,如何选择,就需要权衡效果和资源。

来源:IT168    作者:jude    责编:豆豆技术应用

正在加载评论...