Loading ...

wordpress

插件名称:Lightbox 2

插件版本:2.5.0

适用版本:WordPress Version: 1.5 or higher , Compatible up to: 2.3.1

插件地址

插件介绍:Lightbox 2 是一款很酷的图片显示插件,可以让你在一个平滑展开的新窗口中展现出图片,而同时页面的其余部分都变成黑色背景。使用这款插件,是为了当你的的图片过大必须缩小到页面的宽度时,可以让读者在当前页面浏览完整大小的图片,而不用离开。并且这款插件支持所有主流的浏览器。

Lightbox 2插件很多人都有使用,最早的作者是Lokesh Dhakar,版本一直停留在v2.03.3,并且没有放到Wordpress.org的host上。本文介绍的版本是http://www.stimuli.ca基于原始的Lightbox 2 javascript/css改进,并使用SVN在Wordpress.org上进行更新维护。

同时这个版本还有的特点包括:

提供了Black, White, Grey and Dark Grey四种主题颜色,可以在后台Lightbox 2 Options设置;

在保留了原始的键盘P and N 键进行前进后退的基础上,还使用了 arrow keys 图标扩展;

关闭Lightbox窗口效果图可以使用键盘上的X and Escape 键,或者点击图片外的任何地方;

兼容任何wordpress的主题。

使用方法:

1. 给单张图片加上显示效果,例如:

<a title="标题" href="../原图.jpg" rel="lightbox"><img src="../thumb.jpg"></a>

给原图加上一个rel="lightbox"的属性,并且还可以使用title属性给图片命名。

2. 给一组图片加上显示效果,例如:

<a href="原图-1.jpg" rel="lightbox[roadtrip]"><img src="../thumb-1.jpg"></a>
<a href="原图-2.jpg" rel="lightbox[roadtrip]"><img src="../thumb-2.jpg"></a>
<a href="原图-3.jpg" rel="lightbox[roadtrip]"><img src="../thumb-3.jpg"></a>

给原图-.jpg加上一个lightbox[roadtrip]的属性,同样可以使用title属性给图片命名,并且对图片数量没有限制。

另外,如果觉得每次都要加上这个属性比较麻烦,可以使用Mdkart制作的lightbox-auto插件,它会自动为你完成这些加属性的工作 :)

具体的效果,看下图:

UPDATE:使用这款插件要注意,会和AJAX Comments相冲突,在Firefox下不会显示出效果,而在IE和Opera下没有问题。估计应该是外调Prototype、Scriptaculous、Lightview 这三个Javascript 文件和AJAX Comments已有的JS文件有冲突?暂时没有解决办法,所以二选其一吧!

Tags: , , ,

12 Responses to “Wordpress插件:Lightbox 2”

  1. 漫步 says:

    更喜欢 lightview……..

    回复

  2. fiorano says:

    @漫步 那我试试看,现在这个Lightbox感觉加载有点慢。 :???:

    回复

  3. Gomain says:

    插件不错,可惜yo2网速太慢

    回复

  4. 牧狼羊 says:

    不错,改天更新一下试试。

    回复

  5. seo says:

    我装一个看看怎么样

    回复

  6. .............. says:

    …………………………………………………………………

    回复

  7. skysun says:

    wo ye shishi

    回复

  8. springcity says:

    才发现这个好东西.配合原生相册已经足够强大了.新版本似乎不用配合Cleaner Gallery 使用了.

    回复

  9. cnpabi says:

    牛B的插件,不错

    回复

  10. [...] Fiorano 对这个插件进行了详细的介绍,点击这里查看原文:Wordpress插件:Lightbox 2。 [...]

  11. [...] 安装方法:http://www.gtalkme.com/wordpress/wordpress-plugin-lightbox2.html [...]

Leave a Reply