之前介紹過了Lightbox應用時的疑難雜症,接著來介紹一些Lightbox特效的替代方案。Lightbox有個特殊的優點,就是能夠應用在area map,套用在flickr可愛的正方形縮圖<area>標籤上(請參考這一頁的效果),這點除了Slimbox其他同類特效都沒有支援。
* Slimbox -號稱完全可以取代Lightbox而且載入速度快上許多(檔案不到Lightbox的1/3),暗色背景也不會因瀏覽器視窗被拉大而破掉(這是Lightbox非常惱人的缺點); 但不能嵌入網頁,不能隨瀏覽器視窗調整展示圖片尺寸的缺點,也跟Lightbox一樣。怪的是,在我們的blog上怎麼套用就是無法有效,只能說無緣了。

若不需用應用到area map上,而想找視覺效果較好的類似特效來替代,可以試試以下幾項:
* Lytebox v3.2 -這是我最喜歡用的一種。圖框開啟效果與Lightbox非常相似,但功能更強,可以slide show幻燈片自動播放,也可以嵌入網頁iframe。以下是Lytebox的自動播放效果(確定此頁面loading完畢後點擊下面左圖觀看):


lytebox嵌入網頁iframe效果

* Greybox -可嵌入網頁iframe,圖片顯示時有淡出效果,控制換圖的按鈕固定在視窗上方不受拉動捲軸影響.
* ThickBox 2.0 -可嵌入iframe網頁,可內嵌div元素。拉動視窗捲軸時,圖框維持在畫面中間。

雖然說以上取代方案各有優缺點,但想要在同一個網頁或部落格一石二鳥搭配使用可沒那麼容易,各自的javascript可能會有衝突而造成無效或是效果不完全。如果你跟我一樣不是javascript高手,那肯定是搞不定的。所以請不要太貪心,一次安裝一種是最保險的方法。(本站同時安裝Lightbox與Lytebox,目前還沒有太大問題(除了loading稍慢以外…),想要支援areamap又想要幻燈片自動撥放以及顯示iframe的貪心鬼請先試試這樣的組合,應該比較安全吧!)

即使你很節制的只選用了其中一種,也很有可能出現上一篇沒提到過的問題,這種情況八成是與其他所使用的javascript犯沖了,這時候跟javascript不熟的你,也只好用最笨的方法,一個一個安裝測試,看看你家頁面跟誰最麻吉嚕。

■ 相關文章:[網頁特效小偏方] Lightbox圖片展示 (疑難雜症)

1 回應:

  1. 軟大 said...
    This comment has been removed by the author.