點選圖片的特效-Lightbox2 - 部落格
By Hedy
at 2011-07-26T17:56
at 2011-07-26T17:56
Table of Contents
看前面文章，有朋友在安裝LightBox2 上有問題，我就來野人獻曝囉:)
與前面不同的是，我在安裝css時，是允許外連的，只是在lightbox.js的設定時，
圖片的路徑容易出錯，我建議大家使用絕對路徑去設置，我猜是因為它多加了#
不過我也沒心力去除錯 :(
網誌圖文版:
http://www.joen.cc/2011/07/lightbox2-shadowbox.html
1. 下載Lightbox2
http://www.lokeshdhakar.com/projects/lightbox2/releases/lightbox2.05.zip
2. 解壓縮後，請檢查位於/css/lightbox.css中的prevlabel.gif
及nextlabel.gif的路徑是否正確。
#prevLink:hover, #prevLink:visited:hover { background: url( prelabel.gif的位置
) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url( nextlabel.gif的位
置) right 15% no-repeat; }
3.檢查/js/lightbox.js中的loading.gif,及closelabel.gif的路徑是否正確。
fileLoadingImage: ' loadlabel.gif的位置 ',
fileBottomNavCloseImage: ' closelabel.gif的位置 ',
此處的位置，如果使用相對位置失敗的話，請直接用絕對位置，因為lightbox2似乎有做
一些路徑的處理; 不過我沒那個心力去除錯 :(
4.將其上傳至網頁空間後，再blogger的範本設定中的<head>到</head>間加入:
<!--Lightbox2 Begin-->
<link href=' lightbox.css的位置 ' media='screen' rel='stylesheet'
type='text/css'/>
<script src=' prototype.js的位置 ' type='text/javascript'/>
<script src=' scriptaculous.js?load=effects,builder 請記得在前面加上
scriptaculous.js 的位置' type='text/javascript'/>
<script src=' lightbox.js的位置' type='text/javascript'/>
<!--LightBox2 End-->
--
與前面不同的是，我在安裝css時，是允許外連的，只是在lightbox.js的設定時，
圖片的路徑容易出錯，我建議大家使用絕對路徑去設置，我猜是因為它多加了#
不過我也沒心力去除錯 :(
網誌圖文版:
http://www.joen.cc/2011/07/lightbox2-shadowbox.html
1. 下載Lightbox2
http://www.lokeshdhakar.com/projects/lightbox2/releases/lightbox2.05.zip
2. 解壓縮後，請檢查位於/css/lightbox.css中的prevlabel.gif
及nextlabel.gif的路徑是否正確。
#prevLink:hover, #prevLink:visited:hover { background: url( prelabel.gif的位置
) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url( nextlabel.gif的位
置) right 15% no-repeat; }
3.檢查/js/lightbox.js中的loading.gif,及closelabel.gif的路徑是否正確。
fileLoadingImage: ' loadlabel.gif的位置 ',
fileBottomNavCloseImage: ' closelabel.gif的位置 ',
此處的位置，如果使用相對位置失敗的話，請直接用絕對位置，因為lightbox2似乎有做
一些路徑的處理; 不過我沒那個心力去除錯 :(
4.將其上傳至網頁空間後，再blogger的範本設定中的<head>到</head>間加入:
<!--Lightbox2 Begin-->
<link href=' lightbox.css的位置 ' media='screen' rel='stylesheet'
type='text/css'/>
<script src=' prototype.js的位置 ' type='text/javascript'/>
<script src=' scriptaculous.js?load=effects,builder 請記得在前面加上
scriptaculous.js 的位置' type='text/javascript'/>
<script src=' lightbox.js的位置' type='text/javascript'/>
<!--LightBox2 End-->
--
Tags:
部落格
All Comments
Related Posts
時間顯示問題
By Victoria
at 2011-07-26T12:28
at 2011-07-26T12:28
時間顯示問題
By Ethan
at 2011-07-25T23:01
at 2011-07-25T23:01
您可能會有興趣的文章
By Isla
at 2011-07-25T15:08
at 2011-07-25T15:08
樂多換帳號無法使用備份匯入
By Skylar DavisLinda
at 2011-07-24T22:40
at 2011-07-24T22:40
關於Google的PR值請教
By Cara
at 2011-07-24T17:29
at 2011-07-24T17:29