平凡的幸福(備站）

以HTML + jQuery開發可以跨不同的平台系統，輔以Cordova編譯可以轉成Android、iOS、Windows Phone的APP程式。

Android版本（Play商店）： https://play.google.com/store/apps/details?id=com.twtnn.puzzle_sample

原始碼（GitHub）： https://github.com/lyhpcha/puzzle_sample

Google Fonts有許多的英文字型可以讓網頁文字有更多的變化。
而在Google的Web Font Early Access中，已經有五種中文字型了，
只要以CSS的語法就直接可以套用在網頁上，也有提供字型下載。
網址：https://www.google.com/fonts/earlyaccess

node-webkit是一個整合Chrome瀏覽器與node.js的專案，採用V8 JavaScript編譯引擎。
可以開發桌面型的HTML+js的程式，而且還支援跨平台。
Node-webkit目前支援了Linux、Windows與MacOS等三大平台，還可以用npm安裝node.js。

Node-Webkit下載：https://github.com/nwjs/nw.js/

如果網址列中帶有中文，雖然在瀏覽器上可以正確看到中文，但是複製網址到記事本上卻出現亂碼。

其實它不是亂碼，因為URL在網路上只能以ASCII碼傳送，而ASCII就只有英、數字及特殊符號，
當然中文就不再支援之列，所以必須將中文以UTF8轉成16進位，傳送到瀏覽器之後，再解碼回來，

URL的編碼格式是採用ASCII碼，不是Unicode，而中文並非ASCII碼。
因此在瀏覽器上看到的中文網址都是經過UTF8的解碼後得到的結果。
所以當我們把瀏覽器的網址複製下來貼到記事本後，就會看到好像亂碼的URL。

例如：

node.js不像其他語言，如PHP、JSP需要有HTTP伺服器才可以
因為node.js本身自己就是一個伺服器。

下面是一個實作的範例，假設存儲為test01.js，以node執行：
D:\project> node test01.js

先以npm安裝sqlite3的相關模組：

1、初始化專案
npm init

在網路上看到一個前端的JS框架：Angular，是由Google維護。
透過「宣告」(Directives Syntax) 來達成JS的動作。

Angular有幾項優點：
宣告式語法 (Directives)
DOM Templates

本想以jQuery直接取得政府Opendata的資料，但是卻失敗了，
錯誤訊息：No 'Access-Control-Allow-Origin' header，
這是因為新版的瀏覽器為了安全性，已經不允許跨網域的取存，
而jQuery的解決方式是改以jsonp來取得JSON的資料。
上次在測試台南市政府的Opendata就是以此方式取得資料，

以台南市公廁地址的開啟資料為例
執行結果如下圖：

上次發現ajax在存取上有跨網域的問題後，就一直想試看看解決的方法，
為了安全性考量，在跨網域存取時，必須得到對方網域的同意才能存取。
所以到網路下載一個免安裝的Apache+MySQL的程式：UniServerZ
解壓縮後，直接執行就可以開啟Apache Web Site，很方便測試。

先寫一個簡單PHP網頁test01.php：

使用的瀏覽器：Google Chrome
版本：40.0.2214.115 m

學習jquery的ajax時，設計了一個簡單的測試ajax的網頁，
直接以file的方式透過瀏覽器測試：file:///E:/test07/www/index.html

結果我在Google Chrome上瀏覽測試時卻出現錯誤：

剛好有需要知道一個沒有固定，但是為2的x次方的數y，要如何找出x：
公式：2^x=y，例如：2的3次方為8（2x2x2）

在Excel中，可以用log對數函數來找到答案，如下圖：

上次利用jQuery來操作canvas的試次還算順利，所以也想用jQuery來操作CSS3 animation。
可是這次就沒有上次那麼幸運了，無論用選擇器或函數，就是無法操作CSS3 animation。

經google大神的幫助，找到一個jQuery的外掛程式：jQuery-Keyframes
下載網址：https://github.com/jQueryKeyframes/jQuery.Keyframes

另外還要下載一個js：prefixfree

在學習css3的過程中，看到有一個animate.css的說明，有數十種特效動畫可以引用，
所以就下載來試用，果然使用上非常的方便，也可以藉此學習css3的語法。

下載網址有兩個位置，其中一個可以線上觀看特效如下：
http://daneden.github.io/animate.css/

選擇想要的特效，按下旁邊的按鈕就可以由標題知道效果。

我使用的jQuery版本是2.1.1、網頁是HTML5，在取得canvas物件時，卻沒有反應。
原來在jQuery取得canvas物件需要有一點「眉角」

Javascript的語法如下：

今天在HTML5的測試網頁中加入一段語法，試著讓SVG可以使用免費的王漢宗中文字型。
語法主要是以CSS宣告使用的字型，再以CSS重設SVG的Tag「text」

SVG是一種以XML定義二維向量圖現的圖形格式，由W3C制定，是一個開啟的標準。
例如有一個001.svg的圖片如下：

文字框在輸入時，如果有按下「Enter」，會讓文字有斷行的情形。
此時如果取出文字框資料（或從資料庫中）放到「Lable」或「HTML」時，斷行就不見了。
其實並不是斷行不見了，只是斷行的特殊符號無法被識別。
所以我們可以用Replace來替換這些特殊符號為可以識別的語法。
VB的斷行符號是vbCrLf