zoukankan      html  css  js  c++  java
  • mui 页面无法下滑拖拽 主要体现在华为手机浏览器

    项目做到中期遇到一个问题,华为手机有些页面显示不全且无法下滑。

    因为之前一直用的Google浏览器的模拟模式进行开发和调试的,一直未发现这个问题。

     

    刚开始 选用mui的下拉刷新上拉加载的方式来进行页面配置。

    忙活半天总算是把android的问题给解决了。然后转头去os上看看。果然ios又出问题了。

    因为头部用的是原生的头部,下面主体内容又都用mui的mui-scroll-wrapper样式栝主了,

    所以使用的时候反应迟钝、不流畅,根据无法正常使用。

     

    接着又有传统方式写html发现在浏览器上是没有问题。问题原因浮现了。

    然后我把相关的js和css全部加进来发现,果然不好使了。

     

    经过排查原因找到了

    原来是因为 mui.min.css 中设置了 touch-action: none;只需要把它删掉就好了

    但因为下拉刷新上拉加载还需要这个属性。

    所以我是直接把mui.min.css文件复制 一份,改个新的名称。

    在不需要使用下拉刷新的页面引用这个新的mui样式就可以了。

    如果嫌麻烦,则在不需要使用“下拉刷新” 的html页面,加上  * { touch-action:inherit; }

    就可以解决问题了。

     本博客是本人原创 未经允许不得转载 谢谢。

      链接地址:http://www.cnblogs.com/richard-ju/p/L2018004.html

  • 相关阅读:
    7.29随堂笔记
    LeetCode77. 组合
    347. 前 K 个高频元素
    LeetCode239. 滑动窗口最大值
    C++_数字字符串互相转换
    LeetCode150. 逆波兰表达式求值
    LeetCode1047. 删除字符串中的所有相邻重复项
    LeetCode20. 有效的括号
    Leetcode225. 用队列实现栈 && LeetCode232. 用栈实现队列
    leetCode5663. 找出第 K 大的异或坐标值
  • 原文地址:https://www.cnblogs.com/richard-ju/p/L2018004.html
Copyright © 2011-2022 走看看