h5遊戲製做

前言：

　　很久沒更新博客了，之前不少都不會，因此經常寫博客總結，卻是如今有點點經驗了就懶了。在過去的幾個月裏，在canvas遊戲框架方面，擼過了CreateJS，玩得了Egret，又學過PIXI.js。在移動前端方面，尤爲是小遊戲開始有一點點小經驗了。但只是小經驗，爲何說是小經驗？

　　首先，深度不足，雖然用得最熟最多的白鷺，但是習慣了JavaScript，對TypeScript的OOP編程掌握得還不夠；其次，對Egret等遊戲框架了解的廣度還不夠，還有至關部分用法沒用到。雖然可以應付朋友圈裏傳播的大多數的H5小遊戲，但是還有很大的進步空間。尤爲是欠缺重度遊戲以及性能方面的處理。因此，不管是通常的Web前端方面，仍是H5遊戲方面，我都要繼續努力學習了。不足錯漏之處，懇請你們多多指點。

佈局的時候，若是一個元素你想讓他的寬高保持必定比例，而不隨屏幕變化，寬高設置的時候，使用同一個單位
都是CSS3的單位，低版本不兼容

2.兼容性：蘋果設備微信強制使用的是os的瀏覽器safar，頁面訪問的體驗遠大於安卓；安卓狀況比較亂套：知乎上有人說是微信6.0.2以上是強制使用的QQ的X5瀏覽器，可是實際狀況來看（公司範圍），一部分手機如（魅族，小米，一加，三星，LG等）使用的是X5內核，另外一部分如（nexus，國靖的小米）使用的是chrome的內核， 由此來看，安卓上的訪問狀況大部分不容樂觀，會不支持某些屬性和出現一些異常。

3.經驗之談：UI給出的設計圖愈來愈美觀了，可是對於前端的要求就變高了，寫頁面以前，良好的頁面結構設計能夠極大地豐富了兼容性和擴展性，這個東西沒有對錯之分，只有好和更好。

4.移動端的動畫：此次我使用的是jquery.animate，出現狀況，ios上各個設備均正常，可是安卓方面X5內核的動畫卡頓嚴重。查閱資料，移動端的動畫大部分使用CSS3和zepto.js，儘可能不使用jquery的，對於移動端的遊戲動畫，流行canvas。

5.touch事件：安卓支持click事件，可是ios不支持，推薦使用touch事件；

touch事件基本類型：touchstart,touchmove,touchend,
對於以前需求中的斷定向上滑動，向左滑動，向右滑動等推薦使用如下代碼進行處理

給你們聯繫方式 ：Zhang__qwr weixin