手機兼容問題記錄二

1、問題：解決ios系統h5頁面滾動條

      分析：只針對ios系統下的，安卓是不存在這個問題的

      解決：

              1）第一次用基礎css實現滾動：overflow：scroll；效果：可以滑動，但是頁面滾動起來非常卡，沒有回彈順滑的效果，                         手指一停，頁面就停住了。

               2）第二次網上搜方法解決了滑動很卡的現象，給很寬的那個容器加上了css屬性：-webkit-overflow-scrolling：touch；                           overflow；scroll；效果滑動非常順滑，有回彈效果，但是也出現了半透明滾動條！滑動過程中有，滑動結束自動消                           失，顯得頁面很low。

               3）第三次嘗試在網上搜索到的僞元素的方法，爲很寬的容器加上：：webkit-scrollbar{background-                                    color:transparent;display:none}

                      結果時而有滾動條時而沒有，很懵逼，不得不繼續我的嘗試探索

                4）第四次把這個僞元素的css樣式去掉了，爲那個很寬的容器加上幾個css屬性：display：webkit-box；padding-  bottom：10px；margin-bottom：-10px；再去嘗試；完美解決！！！這裏的padding和margin的數值是不定的，只要你的設置的值大小足夠將滾動條擠出可視區域即可

 

2、問題：時間戳在iPhone上的問題

      分析：let nowTime=new Date().getTime()，時間戳比較大小， 在Android上沒問題，

                 但在iPhone上有問題：NaN... not a number

     解決：用於比較大小時可轉化爲number， iPhone上要這樣寫，假如是兩端都用

                let now=parseInt(Date.parse(new Date(nowTime.replace(/-/g,'/'))))