图片模糊+QQ浏览器下滑时候出现“网页由某某提供”影响滑动

1 图片是用2倍图。我这次出现模糊的话：每个图片外套一层div就解决了。（讲不出道理）其中试过把png改成jpg，也没啥用。

2 QQ浏览器打开网页，往下翻，会出现“网页由某某提供”会滑动影响自己的网页效果。去掉办法如下：

<script type="text/javascript">
      (function(id){
        var app = document.getElementById(id);
        var touchstartY;
        app.addEventListener("touchstart", function(event) {
          var events = event.touches[0] || event;
          touchstartY = events.clientY; //获取触摸目标在视口中的y坐标
          console.log("touchstartY:"+touchstartY);
        }, false);
 
        app.addEventListener("touchmove", function(event) {
          var events = event.touches[0] || event;
          console.log("end:"+event.changedTouches[0].pageY);
          var tempY = event.changedTouches[0].pageY - touchstartY;


          //注意document.body.scrollTop始终为0
          var scrollTop = document.body.scrollTop || document.documentElement.scrollTop; //获取滚动部分的高度
          var clientHeight = document.documentElement.clientHeight; //获取手机屏幕高度（可视部分高度）
          var scrollHeight = document.body.scrollHeight; //所有内容的高度

          // console.log("events.clientY:"+events.clientY);
          // console.log("touchstartY:"+touchstartY);
          // console.log("scrollTop:"+scrollTop);
          // console.log("clientHeight:"+clientHeight);
          // console.log("scrollHeight:"+scrollHeight);
          // console.log("tempY:"+tempY)
          // if(tempY>0){
          //   console.log("11禁止到顶下拉")
          //   event.preventDefault(); //禁止到顶下拉
          // }
          //向下滑
          if(events.clientY > touchstartY && scrollTop === 0 && event.cancelable) {
            // console.log("11禁止到顶下拉")
            event.preventDefault(); //禁止到顶下拉
          }
          else if(scrollTop + clientHeight > scrollHeight && event.cancelable) {
            // console.log("22禁止到底上拉")
            event.preventDefault(); //禁止到底上拉
          }
        }, false);
      })('app');
    </script>

但是这个办法，不能完全解决。一直上滑，一直下滑，都可以。先上再下，还是会出现“网页由某某提供”，会滑动。

解决办法参考：https://blog.csdn.net/qq_33291022/article/details/94574962

3 分享到微信里的网页，不能直接唤起app，必须经过右上角浏览器打开，而jd，红袖读书分享出的就可以，基本确定是：微信白名单导致（域名）。

希望对有需要的人一些参考意义。有异议和更好办法的请留言。

来源：https://www.cnblogs.com/wulinzi/p/12330344.html

标签

软件

scrolltop

event