• ios中禁用回弹效果


    1.js设置body的高度为视口高度,

    2.设置内滚动容器 #scrollBox

     1 #scrollBox{
     2     overflow-x:hidden;
     3     overflow-y: auto;
     4     -webkit-overflow-scrolling : touch;
     5 }
     6 
     7 body,html{
     8     overflow: hidden;
     9     position: fixed;
    10     top: 0;
    11     bottom: 0;
    12     left: 0;
    13     right: 0;
    14 }

    许多页面的写法是

    document.body.addEventListener('touchmove',(e:any)=>{
         e.preventdefault();
    })

    结果发现,本该滚动的内容器#scrollBox偶现无法滚动,经过测试,猜想如下

    虽然我们通过定位强行让body和html不动了,但是在下拉上拉的时候,浏览器的默认行为还是在。

    偶现的#scrollBox无法滚动是因为此时body还没有滚完。所以此时我们强行让它回弹。

    document.body.addEventListener('touchmove',(e:any)=>{
        document.body.scrollTop = 0;
    })
  • 相关阅读:
    表单
    超链接
    图像
    表格
    排列清单控制标
    HTML基本结构
    如何快速查看网页源代码
    TOR的使用
    google搜索新姿势
    [NOIP2017]列队
  • 原文地址:https://www.cnblogs.com/wxcbg/p/14963766.html
Copyright © 2020-2023  润新知