2008-07-10: 這方法還是有問題,實在是…… 請參考更新版 升級 Lightbox 至 v2.04

之前寫的方法會造成大圖讀取緩慢(因為都是讀原圖),想想還是縮圖比較有禮貌,所以現在貼圖的 HTML 是 blogger 自動插入的:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://原圖.png">
  <img style="display:block; margin:0px auto 10px; text-align:center;cursor:pointer; cursor:hand;" src="http://縮圖.png" border="0" alt="" id="BLOGGER_PHOTO_ID_some_id" />
</a>

通常會再刪一點:

<a href="http://原圖.png">
  <img src="http://縮圖.png" alt="替代文字" />
</a>

JavaScript 則改為:(使用 Lightbox 2.03.3Prototype 1.6.0

$$('.postcontent img').each( function(i) {
  var fullSrc = i.src;  // fullSrc : 原圖的位址
  if( i.up('a') && i.up('a').href )
  {
    var srcExt = i.up('a').href.split('.').pop().toLowerCase();
    if( srcExt == 'png' || srcExt == 'jpg' || srcExt == 'gif' || srcExt == 'bmp' )
    { fullSrc = i.up('a').href; }
  }
  var imageLink = new Element("a", { rel: 'lightbox[post]', href: fullSrc, title: i.alt });
  i.insert({'before': imageLink});   // 'top' insert 在 ie 會出問題
  Event.observe( i, 'click', function(event) { myLightbox.start(imageLink); Event.stop(event); });
});