phpBB 自動縮圖

有會員要求在 I-Circle Forum 設定一個自動縮圖的功能，故我研發了一個使用 JavaScript 的自動縮圖小功能。將之加入風格資料夾內的 forum_fn.js 最底部即可。

這個自動縮圖能夠在圖片縮細後建立連結，方便使用者瀏覽完整版本的圖片。此外，如果自動縮圖發現上層有 [url] 討論區代碼包著（即圖片本身有連結），它將不會建立連結。

至於 jQuery，由於我認為未是時候安裝 jQuery，所以我並未編寫 jQuery 版本。

/**
* Create Image Thumbnail
*/
function create_img_thumb() {
  var divs = document.getElementsByTagName('div');
  for(var i in divs) {
    if(divs[i].className == 'content') {
      var imgs = divs[i].getElementsByTagName('img');
      for(var j in imgs) {
        if(imgs[j].offsetWidth > 400) {
          imgs[j].style.width = '400px';

          // check if [url] covers the image
          var parentNode = imgs[j];
          var covered = false;
          do {
            parentNode = parentNode.parentNode;
            if(parentNode.tagName.toLowerCase() == 'a') {
              covered = true;
              break;
            }
          } while(parentNode.className != 'content');

          if(!covered) {
            var a = document.createElement('a');
            a.className = 'postlink';
            a.href = imgs[j].src;
            a.appendChild(imgs[j].cloneNode(true));
            imgs[j].parentNode.replaceChild(a, imgs[j]);
          }
        }
      }
    }
  }
}

onload_functions.push('create_img_thumb()');

由於 WordPress 限制，上述代碼頗混亂。如要使用及檢視代碼，到 I-Circle Forum 的相關文章檢視整理了的代碼。