• 移动端经常遇到的小bug


    1、video 不能自动播放


      (1) autoplay 及 js 控制播放,仍然有部分设备不起作用
      (2) $("html").one("touchstart",function(){
          video.play();
        })

    2、input 输入框,软键盘弹出的时候会把底部的内容往上压缩,使得底部布局混乱


      (1)获取内容的总高度,赋值给body,写死body的高度
      $("body").css("height",parseInt($(".scroll-wrap").height()+$(".fixNav").height()));
      (2)fix固定定位元素
      当获取焦点(软键盘出来时候) 就把fix定位的元素改为静态定位
      当失去焦点(软键盘消失时候) 再把原fix定位的元素改为fix定位

      (3)input框被软键盘遮盖
      https://mingyili.github.io/2015/11/05.html

    3、手机拍照及上传


      <input type="file" accept="image/*">
      <input type="file" accept="video/*">
      部分安卓设备不支持

    4、移动端模拟hover


      (1) active模拟 document.addEventListeren("touchstart",function(){},true);
      (2) js监听触屏事件 动态添加/移除class类名

    5、修改input placeholder文字颜色


      input::-webkit-input-placeholder{color:red;}

    6、去除webkit默认的滚动条


      element::-webkit-scrollbar{
        display:none
      }

  • 相关阅读:
    spring cglib final @Transactional
    【转】电商架构
    logback发邮件配置
    @Reference不支持继承
    jmap jstack
    dubbo线程池
    C# 爬虫框架实现 流程_爬虫结构/原理
    C# 爬虫框架实现 流程_各个类开发
    C# 爬虫框架实现 概述
    作用域 作用域链 闭包 思想 JS/C++比较
  • 原文地址:https://www.cnblogs.com/wusan/p/7686012.html
Copyright © 2020-2023  润新知