做移動端的Web也有一段時間了，踩過的坑真心不少。
下面列出一些，移動端瀏覽器兼容性的Bug，供大家參考。
【UC瀏覽器】video標簽脫離文檔流
場景：<video>標簽的父元素(祖輩元素)設置transform樣式后，<video>標簽會脫離文檔流。
測試環境：UC瀏覽器 8.7/8.6 + Android 2.3/4.0 。
Demo：http://t.cn/zj3xiyu
解決方案：不使用transform屬性。translate用top、margin等屬性替代。
【UC瀏覽器】video標簽總在最前
場景：<video>標簽總是在最前（可以理解為video標簽的z-index屬性是Max）。
測試環境：UC瀏覽器 8.7/8.6 + Android 2.3/4.0 。
【UC瀏覽器】position:fixed 屬性在UC瀏覽器的奇葩現象
場景：設置了position: fixed 的元素會遮擋z-index值更高的同輩元素。
在8.6的版本,這個情況直接出現。
在8.7之后的版本,當同輩元素的height大於713這個「神奇」的數值時,才會被遮擋。
測試環境：UC瀏覽器 8.8_beta/8.7/8.6 + Android 2.3/4.0 。
Demo：http://t.cn/zYLTSg6
【QQ手機瀏覽器】不支持HttpOnly
場景：帶有HttpOnly屬性的Cookie，在QQ手機瀏覽器版本從4.0開始失效。JavaScript可以直接讀取設置了HttpOnly的Cookie值。
測試環境：QQ手機瀏覽器 4.0/4.1/4.2 + Android 4.0 。
【MIUI原生瀏覽器】瀏覽器地址欄hash不改變
場景：location.hash 被賦值后，地址欄的地址不會改變。
但實際上 location.href 已經更新了，通過JavaScript可以順利獲取到更新后的地址。
雖然不影響正常訪問，但用戶無法將訪問過程中改變hash后的地址存為書簽。
測試環境：MIUI 4.0
【Chrome Mobile】fixed元素無法點擊
場景：父元素設置position: fixed;
子元素設置position: absolute;
此時，如果父元素/子元素還設置了overflow: hidden 則出現“父元素遮擋該子元素“的bug。
視覺(view)層並沒有出現遮擋，只是無法觸發綁定在該子元素上的事件。可理解為：「看到點不到」。
補充： 頁面往下滾動，觸發position: fixed;的特性時，才會出現這個bug，在最頂不會出現。
測試平台： 小米1S，Android4.0的Chrome18
demo： http://maplejan.sinaapp.com/demo/fixed_chromemobile.html
解決辦法： 把父元素和子元素的overflow: hidden去掉。
———— 先這樣吧，應該會持續更新的 ————
本文鏈接：http://www.cnblogs.com/maplejan/archive/2013/04/26/3045928.html
作者：Maple Jan