灰色後門

很多網站除了桌面版本外，也會另外提供行動版本的網站 當然現在RWD的設計很流行，只是也不是所有的聲音都贊同就是 不過再說到這些設計需求時，有一個先決條件是要先判別瀏覽器是否為行動版本 判斷上我們會使用User-Agent當依據，這裡不多說 Detect Mobile Browsers 這個開源工具庫提供了方便判斷的小工具 而且具有Apache、ASP.NET、JSP、Python、C#、Rails等各種語言的版本 以下用最新下載的JavaScript版本(2013/3/27下載)來看

Chrome瀏覽器的 "進階設定" 預設網頁顯示的字體大小最小為12px 所以會有雖然CSS設定了 font-size 小於12px，但卻無法生效的情況 以前的解決方式是在CSS增加 -webkit-text-size-adjust:none; 這行 不過這個屬性已經不再被Chrome支援了，所以不要再想這件事吧...XD Chrome 的這個設定算是設計上的思考，而不是bug 很多字體、特別是中文字之類結構較複雜的文字，在小尺寸時易變形、模糊 而維持 12px 也是讓瀏覽器上的閱讀保持易讀性的方法之一

這篇文章接續 拖曳物件的教學 利用之前寫好的架構再接續較複雜的行為 示範的目標是一水平排列的清單內容，並做到藉由拖曳清單項目改變其排列順序 首先準備好兩種CSS，分別給一般狀態以及拖曳中狀態下的清單項目使用 .undrag {     position:relative;     z-index: 1;     opacity: 1;     filter: alpha(opacity=100);     top: 0px;     left: 0px;     cursor: pointer; } .drag {     z-index: 100;     position:absolute;     opacity: .50;     filter: alpha(opacity=50);     cursor: move; }

實作成果示範 物件拖曳的重點在於物件位置的計算公式 - 目前滑鼠位置-起始滑鼠位置+目標位置 單純拖曳物件的話不算困難 說的上比較困難的是拖曳之後要結合的動作(如：drop、sortable list等) 雖然HTML5有Drag相關的API，不過這邊就先不提了 先做出一個能相容於老舊瀏覽器(IE)的版本 GitHub檔案目錄

PhoneGap是一個行動開發框架 目的是讓開發者使用HTML5技術開發應用程式後，就能快速的部署到各平台 使開發者能專注在程式本身及減少學習上的成本 HTML5應用程式經過PhoneGap轉換後會變成原生應用程式 網頁本身會使用平台核心的瀏覽器功能讀取，例如：android.webkit.WebView 而透過呼叫PhoneGap的API，應用程式就能使用平台原生的相機功能、影片、音樂等 PhoneGap的官網： http://phonegap.com/ 教學引導 在被Adobe買下後，PhoneGap的核心被捐贈給Apache基金會，並改名為Apache Cordova專案 本篇文章僅示範PhoneGap在Android平台的簡單使用 以Eclipse IDE為示範進行開發，建議先參考 Android SDK開發環境設定 以下為開發工具版本，對於2.x版應該都適用 Eclipse：4.2 Juno PhoneGap：2.5.0

開發Android程式需先安裝Java的JDK工具和Android SDK Java的安裝參考 以前文章 ，Android開發者網址為 http://developer.android.com/sdk/index.html 在之前，Google的作法是將安裝套件拆開讓開發者自行搭配 但因為使用率不彰的關係，現在整合成ADT(Android Developer Tool)簡化開發者的安裝步驟 裡面包含了SDK本身、AVD模擬器以及Google為Android設計的Eclipse版本 雖然說開發不限定IDE的類型，但Eclipse是Google投入最多資源協助的IDE