美文网首页
微信H5页面禁止下拉显示网页来源

微信H5页面禁止下拉显示网页来源

作者: 考考拉拉 | 来源:发表于2017-05-23 13:31 被阅读0次

          新入职微信小游戏开发以来,由于公司老板强烈要求禁止页面上下滑动, 所以直接给document的touchmove事件禁止掉就行了,但是发现在ios端直接position:fixed也可实现,查询微信开发者文档之后才知道,微信ios客户端于2017年3月1日已逐步将旧版的UIWebview升级为WKWebview,所以ios端直接fixed就能禁止页面上下滑动;但在andriod手机还必须使用以下代码:


    document.ontouchmove = function(e){

        e.preventDefault();

     }


        但此段代码可将整个页面的touchmove事件禁掉了,如果页面有部分区域必须需要滑动,需要用touchmove事件的话,那么可以把那部分的touchmove事件过滤掉,如下代码,整个body中除了more_game_inner块以外都不能touchmove;


    document.querySelector('body').addEventListener('touchmove', function(e) {

           if (!document.querySelector('.more_game_inner').contains(e.target)) {

                  e.preventDefault();

            }

    })


    相关文章

      网友评论

          本文标题:微信H5页面禁止下拉显示网页来源

          本文链接:https://www.haomeiwen.com/subject/qrnwxxtx.html