Archive for the ‘ Website ’ Category

Adsense 與 IE8 的錯誤訊息 800a03e8

最近變更網頁的佈景主題, 也插入了 Adsense 的廣告。網頁在 Firefox、Chrome 的顯示都正常, 唯獨在 IE8 卻會出現 "800a03e8" 的 Javascript 錯誤, 有時甚至連網頁都無法顯示!!

畫面如下:

解決方法:

因為新的佈景主題有加入了 IE7 的 "相容性檢視", 只要把這一行從佈景主題的原始碼刪除即可:

<!meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

這樣做了的缺點是，以後只能使用 IE8 允許的標準設計網站!!不過這也不算什麼缺點，畢竟 IE 過去都不按照 W3C 的網站設計標準走。

Javascript 模擬 jQuery 的選擇器(Selector)

JQuery 強大、方便的選擇器 (Selector) 是 jQuery 不可或缺的功能之一。不過如果我們不想載入 jQuery 而只想使用類似 jQuery 選擇器的功能，那可以用自訂函式的方式做到:

function $$(theElement){
    switch(theElement.charAt(0)){
    case ("#"):
        // 以 $$("#id") 傳回物件
        return (document.getElementById(theElement.replace(/^#/, "")));
    case ("."):
        // 以 $$(".class") 傳回物件陣列，IE 不支援
        return (document.getElementsByClassName(theElement.replace(/^\./, "")));
    default:
        // 以 $$("tag") 傳回物件陣列
        return (document.getElementsByTagName(theElement));
    }
}

或是簡單一點，僅傳回指定 id 的物件:

function $$(theElement){
    return(document.getElementById(theElement));
}

我把這自訂的函式取名為 $$()，用以與 jQuery 的 $() 做區隔。

但是要注意，以上兩個函式傳回的都是 DOM 物件，與 jQuery 在其它操作上並不相同。

《網頁設計-愛上jQuery》讀書心得及評論

使用 Javascrip 的框架來開發網頁的程式可以加快開發的速度，其中 jQuery 也是頗受歡迎的一員。

不過目前可以買得到的 jQuery 中文書籍實在寥寥可數，以下是最近閱讀《網頁設計-愛上jQuery》這本書的心得及評論 (作者是羅子洋)。 Read more

使用 .htaccess 自訂「404 找不到網頁」的頁面

一般我們租用的虛擬主機無法讓我們修改 httpd.conf，所以只能透過使用 .htaccess 來自訂「404 找不到網頁」的頁面。

Read more

讓 FCKeditor 瀏覽圖檔時，可以顯示縮圖

FCKeditor 雖然有提供很多種程式語言的檔案瀏覽程式，讓你可以很方便地上傳及插入遠端伺服器上的圖檔，但在瀏覽檔案的同時，我們最需要用到的圖檔卻不能顯示縮圖，感覺很不方便 (應該是故意留了一手)。

雖然官方網站上有建議使用 CKFinder 這支外掛程式來管理伺服器上的檔案，但 CKFinder 卻不是免費的。

思考了一下，雖然我的 PHP 很爛，但只是要做個縮圖的功能應該還難不倒我，於是就花了幾個小時把縮圖的功能實做出來。原理很簡單，只是先在相同目錄下產生 ".thumb.gif" 的縮圖檔，在列示時將縮圖顯示出來。

Read more

CSS 及網頁設計的相關網頁

網頁設計

Read more

JavaScript 及動態網頁設計(dhtml)的相關網頁

國外網站

中文網站

其它

JavaScript 的規則運算式(Regular Expression)

樣式比對

var mail = "yourname@domain.name";
var re = /^.+@.+\..+$/;
if(re.test(mail)){  alert("pass");  }

樣式取代

參考網頁

  1. 規則運算式簡介
  2. 規則運算式語法
  3. 石頭閒語: Regular Expression(RegExp) in JavaScript

讓網頁的「外部超連結」自動開啟在新視窗

在編輯網頁時，如果要讓某個超連結 (Link) 開啟在新的瀏覽器視窗，我們可以在超連結加上「href="_blank"」屬性，但如果超連結很多，要一個一個加上去畢竟麻煩!!

以下的程式碼可以幫你把網頁內所有針對「外部」的超連結自動設為在新視窗開啟。

一般網頁

  1. 將下列程式碼加到網頁的 <head> 區段: 
    <script type="text/javascript">
function parseLink(){
  var tagA = document.getElementsByTagName( "a" );
  re = new RegExp( "^(http://" + document.domain + ")|(javascript:)", "i" );
  for( var i=0; i < tagA.length; i++ ){
    if( !tagA[i].href.match( re ) ){ tagA[i].target = "_blank"; }
  }
}
</script>
  2. 在 <body> 標籤內的 onload 事件加入: 
    parseLink();

    Ex:

    <body onload="parseLink();">

WordPress 外掛程式

如果你的網站是用 WordPress 架設，可直接在控製台搜尋並安裝「Open external links in a new window」這個外掛程式 (版本: 1.3.1 作者: Kristian Risager Larsen)，這樣就不用添加任何程式碼了。

另外需注意，如果本外掛程式與其它像 LightBox、FancyBox...之類的圖片燈箱特效的程式一起使用，有可能會造成同時顯示燈箱特效，又同時將圖片開啟於新視窗!!

一些好用的 JavaScript 的網址列指令

以下這些 JavaScript 指令，只要打在瀏覽器的網址列即可:

  • 變更視窗大小: 
    javascript:window.resizeTo(800,600)
  • 檢視 Cookies: 
    javascript:alert("Cookie:"+document.cookie)
  • 列印網頁: 
    javascript:print()

    • PAGE NAVI

    INFORMATION

    我們解決了什麼問題？我們創造了什麼價值？

    return top