zoukankan      html  css  js  c++  java
  • Android系统overflow失效的BUG

    昨天做项目的时候,遇到了一个奇怪的问题。 

    问题仅在安卓手机端自带浏览器出现。 用chrome 自适应调试  模拟安卓浏览器时无法重现问题。

    安卓手机下用chrome 联机调试又没有问题,仅在安卓自带浏览器内核的情况下才能重现该BUG

    这对我的调试十分的不方便。 

    这个BUG是这样的:

    在父类的prosition:absolute / relative 的时候  父类上如果有overflow属性,overflow属性会失效。

    比如 

    section{
        position: relative;
        100%;
        overflow-x: hidden;
        overflow-y: scroll;
    }
    section  > div {
        position:absolute;
        left:100%;
        top: 0;
    }
    

     这里的section下的div 在安卓自带浏览器下,还是会溢出,

    并且导致页面可以左右滑动。

    那么解决办法就是  将 overflow属性  写到div上。

    最终解决的代码:

    section{
        position: relative;
         100%;
        height: 100%;
    }
    section > div{
         100%;
        height: 100%;
        position: absolute;
        top: 0px;
        left: 100%;
        overflow-y: scroll;
    }
    

      这个BUG 挺诡异,特此备案,用以警示。

  • 相关阅读:
    this指向问题
    b继承a的函数
    如何解决跨域问题
    事件冒泡和阻止事件冒泡
    Spring5(二)——IOC
    MySQL基础(四)——
    MySQL基础(二)——常用命令
    MySQL基础(一)——入门
    Linux(二)——常用命令
    Linux(一)——简介
  • 原文地址:https://www.cnblogs.com/wufengjie/p/4885159.html
Copyright © 2011-2022 走看看