解決方法如下:
(相關(guān)視頻推薦:html視頻教程)
1、ios端的-webkit-overflow-scrolling屬性可控制頁(yè)面滾動(dòng)效果,設(shè)置如下實(shí)現(xiàn)慣性滾動(dòng)和彈性效果:
body{ -webkit-overflow-scrolling: touch; overflow-scrolling: touch; overflow-y: scroll; }
登錄后復(fù)制
2、由于盒子設(shè)置了高度100%引起的:
html,body{ height: 100%; }
登錄后復(fù)制
將上述代碼刪除即可。
3、如果這兩種都還是不行的話(huà),還有一種解決辦法,就是使用mui組件里面的的區(qū)域滑動(dòng)組件
<div class="mui-scroll-wrapper"> <div class="mui-scroll"> <!--這里放置真實(shí)顯示的DOM內(nèi)容--> </div> </div> <script> mui('.mui-scroll-wrapper').scroll({ scrollY: true, //是否豎向滾動(dòng) scrollX: false, //是否橫向滾動(dòng) startX: 0, //初始化時(shí)滾動(dòng)至x startY: 0, //初始化時(shí)滾動(dòng)至y indicators: true, //是否顯示滾動(dòng)條 deceleration:0.0006, //阻尼系數(shù),系數(shù)越小滑動(dòng)越靈敏 bounce: true //是否啟用回彈 }); </script>
登錄后復(fù)制
根據(jù)你的實(shí)際情況配置scroll里面的值。
注意: bounce: true這個(gè)必須為true ,如果改為false后,整個(gè)頁(yè)面就無(wú)法滑動(dòng)了
相關(guān)推薦:h5