志
爱好·网站建设
日志阅读：9507
日志评论：33

上一篇日志 «
下一篇日志 »

在SaBlog中轻松应用酷炫的图片展示方式LightBox

该日志由 Kevin 发表于 2007, July 7, 4:30 PM

刚刚用sablog的时候，一开始就想把喜欢的LightBox图片展示效果应用于sablog，后来发现Wodi已做好了这件事，于是把他的东西照搬过来，发现一些问题，按照他提供的来修改的话，页面总会出错，有时候页面只显示了一小部分，一开始以为是我自己修改时的问题，于是按照他的思路改，终于可以用了，这几天又发现原来不只我一个人用了会出错，比如傻猫也是这样......傻猫那天跟我直接要了那几个改动过的文件，就在发给他文件之后，我偶然发现，其实那个特效还是有问题：

1、虽然点击图片以后是有效果出来，但是不能实现多张图片连续展示的效果，只能一张张的点击打开；

2、假如使用sablog中的编辑器为附件图片排版时，图片也是没有LightBox特殊

于是刚才仔细看了一下，发现其实实现的方法并不用像Wodi那样繁琐，按我现在用的这样稍微一下就行了：

1、下载下面的附件，解压到sablog的根目录下；

2、打开模板中的index.php，在</head>（最后不要改变这个位置，测试发现，在一些位置的话，加载js时会出错)之前加入以下代码：

XML/HTML代码
  1. <script type="text/javascript" src="/plugins/lightbox/js/prototype.js"></script>      
  2. <script type="text/javascript" src="/plugins/lightbox/js/scriptaculous.js?load=effects"></script>      
  3. <script type="text/javascript" src="/plugins/lightbox/js/lightbox.js"></script>      
  4. <link rel="stylesheet" href="/plugins/lightbox/css/lightbox.css" type="text/css" media="screen" />  

 

3、修改模版的show.php，找到：

PHP代码
  1. if ($article['image']) {  

在下面加上以下代码：

PHP代码
  1. if ($imagenum > 1){   
  2. $lightboxrel = "lightbox[roadtrip]";   
  3. }   
  4. else{   
  5. $lightboxrel = "lightbox";   
  6. }  

 

同时把图片的链接都加上rel="$lightboxrel"的属性
如：

XML/HTML代码
  1. <a href="attachment.php?id=$image[0]" target="_blank" rel="$lightboxrel">  

同理，以同样的代码修改normal.php

4，修改根目录的global.php，找到：

PHP代码
  1. global $article, $attachmentids, $options;   
  2. if ($article['image'][$aid]) {   
  3.     $attachmentids[]=$aid;  

 

在下面加上：

PHP代码
  1. $imagenum = count($article['image']);   
  2.         if ($imagenum > 1){   
  3.             $lightboxrel = "lightbox[roadtrip]";   
  4.         }   
  5.         else{   
  6.             $lightboxrel = "lightbox";   
  7.         }  

同时把图片的链接都加上rel="$lightboxrel"的属性

这样，LightBox的特效就能完美的应用于Sablog了！

演示可看：http://www.bluefeel.com/show-599-1.html

还是有人说不知道怎么改，汗， ， 还是提供一下Global.php吧：global.php

 

附件: lightbox.rar (70.97 K, 下载次数:346)

 蓝风网络日志标签:    图片, 插件, sablog　Tiffany Jewelry
网摘： Yahoo Baidu Google Bolaa 365Key Yesky Wozhai POCO ViVi YouNote Hexun Del.icio.us Yeeyoo igooi I2Key Cn3 Bytemen Furl Blinklist Blogmarks Technorati 分享到饭否

« 上一篇： 广州地铁终于开始提倡“靠右站稳，左侧同行”了 | 下一篇：尼古拉斯.凯奇的《预见未来》 & 无名氏... »

相关文章： (最多只显示10条记录)
引用： 点击获得Trackback地址,Encode: UTF-8　点击获得Trackback地址,Encode: GB2312 or GBK　点击获得Trackback地址,Encode: BIG5
» 我要发表评论 你的参与是我最大的动力！    访客评论： (33条记录)
  1. Gravatar
    21楼 dken 2007, August 17, 12:56 PM
    没办法呀,一直都是喜欢这类的,,,和我以前用的那个很像,,如果我没找到这个,我还打算把我以前用的那个搬过来呢..现在的这个也还要改,,不过最近没时间了..唉,,这不LOGO都没换..嘻嘻..
  2. Gravatar
    22楼 Kevin 2007, August 17, 4:04 PM
    Logo就换一下吧，嘿嘿！
  3. Gravatar
    23楼 coinyang 2007, October 12, 11:16 PM
    请问一下，对在安装LightBox之前的图片，是不是不能这样浏览？
  4. Gravatar
    24楼 coinyang 2007, October 12, 11:19 PM
    我找你的这个安装了，有的图片可以，有的图片不行，一点击直接在新浏览器里打开图片了，奇怪。
  5. Gravatar
    25楼 Kevin 2007, October 12, 11:41 PM
    引用 coinyang 说过的话:
    请问一下，对在安装LightBox之前的图片，是不是不能这样浏览？

    假如不是生成html的话，都没有区别的，你说的问题应该是因为页面没有完全加载完，这个特效必须在整个页面完全加载完以后点击才有效的！
  6. Gravatar
    26楼 coinyang 2007, October 13, 1:00 AM
    谢谢Kevin，确实是页面没加载完成的原因，页脚CNZZ的统计影响的，才知道他们服务器在维护，影响了我页面的加载速度。

    另外一个奇怪的问题，我直接从你这里下的global.php，但是发现后台一发布文章就跳到空白页去了，一把原来版本的global.php换上就不空白，郁闷死了啊，认真看了代码，没看出什么原因来。

    用的EditPlus 2打开看的代码，而且也没做任何修改，也没做保存动作。

    依你的经验，问题应该出在哪里？
  7. Gravatar
    27楼 Kevin 2007, October 13, 2:06 AM
    应该是版本的问题，我提供的版本肯定不是最新版的，所以假如你升级了Sablog，就有可能出问题，建议你不要直接下载，还是按我说明的那样改一下吧，也不是太复杂~
  8. Gravatar
    28楼 coinyang 2007, October 13, 10:48 PM
    谢谢Kevin，热心回答问题，呵呵。

    经过一整天地不停测试，我发现这个出现发表文章出现空白应该是Sablog-X 1.6版本的错误：只要tag里有某几个字符或文字，绝对会变成空白，例如·，常包含在外国人名中间。
  9. Gravatar
    29楼 Kevin 2007, October 14, 11:57 AM
    这个倒是没有试过，不过，有一点要注意，不要用windows自带的记事本编辑，因为它老是会自作聪明的改变一些字符，导致出错！
  10. Gravatar
    30楼 blue80 2007, October 22, 8:04 AM
    <a href="attachment.php?id=$image[0]" target="_blank" rel="$lightboxrel">  
    这里不懂什么意思.????
  11. Gravatar
    31楼 Kevin 2007, October 22, 8:52 AM
    引用 blue80 说过的话:
    <a href="attachment.php?id=$image[0]" target="_blank" rel="$lightboxrel">  
    这里不懂什么意思.????
    假如这个你不懂什么意思的话，建议你按我说明的那样修改~
  12. Gravatar
    32楼 geniusy 2007, December 14, 4:00 PM
    改好了，谢了
    其实有很多不知道怎么改是因为global.php文件里面在网址里面需要加入的是rel=\"$lightboxrel\"，而不是rel="$lightboxrel"，里面涉及转义符
  13. Gravatar
    33楼 Kevin 2007, December 21, 9:47 PM
    哦，那这个可能是我粗心了，有些时候是需要转义的~
Total:33‹ Prev12
 
发表评论：( 来了就留个脚印吧！你的参与是我最大的动力！)