
html5 boilerplate 是一套免費前端 Html5 模板,裡面支援 Normalize.css、jQuery (透過 Google CDN 或本地端讀取) 及 Modernizr,目前支援 IE 8 以上瀏覽器,但是最近看到官方正在討論是否該拿掉 IE 8 支援,原因是 Microsoft 今年宣佈 2014 年 4 月 8 日以後將不再支援 Windows XP,討論中也提到目前 IE 8 的市占率,其實還不小,雖然大部分使用者可能來自亞洲
[Read More]
html5 boilerplate 是一套免費前端 Html5 模板,裡面支援 Normalize.css、jQuery (透過 Google CDN 或本地端讀取) 及 Modernizr,目前支援 IE 8 以上瀏覽器,但是最近看到官方正在討論是否該拿掉 IE 8 支援,原因是 Microsoft 今年宣佈 2014 年 4 月 8 日以後將不再支援 Windows XP,討論中也提到目前 IE 8 的市占率,其實還不小,雖然大部分使用者可能來自亞洲
[Read More]HTML5 Boilerplate 在 V5.0 版本將不支援舊有瀏覽器,包含 IE6/7. Firefox 3.6 (Mozilla 已經不再維護) 及 Safari 4,詳細資料可以參考 V5.0 的 Milestone (Drop legacy browser support) 下一版本會有哪些改變呢?
IE 10+ 將不再支援 conditional comments,至於 normalize.css 轉換到 2.1.x 版本,如果有用 Sass 的朋友們,可以參考我改的 normalize.scss,非常期待 Version 5 出來,會拿掉很多 legacy code。
程式設計師在網頁表單上通常會設計很多提示的功能,而在 Html5 提供了 placeholder attribute 這功能,目前 FireFox Safari Google Chrome 都沒有顯示上的問題,唯獨 IE8(含以下)都沒辦法顯示這功能,所以必須透過 javascript 來解決這部份問題了,網路上找到這篇解決方式,底下是原始碼
解決原理其實很簡單,那就先將 placeholder 寫入到 input value 裡面,在 focus event 當下比對 input value 是否等於 placeholder 的值,如果是就清空,反之透過 onblur event 來寫回原先的 placeholder 值,缺點就是如果當 input type = password 的時候會很麻煩。底下提供轉成CoffeeScript 的程式碼:
add_placeholder = (id, placeholder) ->
el = document.getElementById(id)
el.placeholder = placeholder
el.onfocus = () ->
if(this.value == this.placeholder)
this.value = ''
el.style.cssText = ''
el.onblur = () ->
if(this.value.length == 0)
this.value = this.placeholder
el.style.cssText = 'color:#A9A9A9;'
el.onblur()
# Login Form
add_placeholder('myInputField', 'IE Placeholder Text')如果有用 jQuery 的話,可以把第二個參數改寫成$("#input_id").attr("placeholder")PHP
CSS
Html5
Git:
Javascript:
FreeBSD:
[Read More]
今年在 COSCUP 大會上最主流的議題就是 Html5,今天看到一個網站 HTML5 Boilerplate,這網站提一個全新 html 5 模板,自從離開 Dreamweaver 樣板軟體,利用 Pspad 手動撰寫 html,此網站就發揮非常大的用處,提供全新 html,CSS 以及 javascript,支援了底下很多功能: