移動端常見問題

2022-05-04 17:51:12 字數 861 閱讀 7327

1、上下拉動滾動條時卡頓、慢

body

2、禁止複製、選中文字

element

解決移動裝置可選中頁面文字(視產品需要而定)

3、長時間按住頁面出現閃退

element

4、iphone及ipad下輸入框缺省內陰影

5、ios和android下觸控元素時出現半透明灰色遮罩

6、active相容處理

7、動畫定義3d啟用硬體加速

element

注意:3d變形會消耗更多的記憶體與功耗

8、retina屏的1px邊框

element

9、旋轉螢幕時,字型大小調整的問題

html, body, form, fieldset, p, div, h1, h2, h3, h4, h5, h6

10、transition閃屏

/設定內嵌的元素在 3d 空間如何呈現:保留3d /

-webkit-transform-style: preserve-3d;

/ 設定進行轉換的元素的背面在面對使用者時是否可見:隱藏 /

-webkit-backface-visibility:hidden;

11、圓角bug

某些android手機圓角失效

background-clip: padding-box;

移動端常見問題

1 ios下input為type button屬性disabled設定true,會出現樣式文字和背景異常問題 解決方案 使用opacity 1來解決 2 對非可點選元素如 label,span 監聽click事件,部分ios版本下不會觸發 解決方案 css增加cursor pointer就搞定了 3...

移動端常見問題

一.點選穿透 原因 1.touch事件300ms後,觸發click事件 2.混用touch和click會導致點透問題。解決思路 1.不要混用touch和click 2.阻止掉 touch之後的click。解決方案 1.tap後延遲350ms再隱藏mask 2.pointer events mask隱...

移動端常見問題

移動端的頁面多數情況下用百分比或者 查詢來設定頁面的寬高度 這樣會達到響應的效果 這裡解釋幾點 1.webkit tap highlight color rgba 0,0,0,0 也可以寫成 webkit tap highlight color transparent 去掉點選時高光顯示 你也可以更...