标题的需求问题其实我经常遇到。尤其是在碰到页面同时出现有视频及弹层的情况。

当然我说的问题皆是针对微信H5开发的哈

IOS中,视频播放,弹层出现时,视频在弹层的下面,不会出现问题;

安卓手机中,完了,视频播放,弹层出现,视频在弹层的上方,完了完了,此时我们的解决办法前提是页面很长,足够视频的位置未出现在我们能看到的界面中,此时弹层出现了。那我们这时就禁止页面滚动,方式视频再次进入我们的视线界面中。

不多说,方法如下:

var yazi=function(e){e.preventDefault();};
function stop(){
document.body.style.overflow='hidden';
document.addEventListener("touchmove",yazi,false);//禁止页面滑动
}
/***取消滑动限制***/
function move(){
document.body.style.overflow='';//出现滚动条
document.removeEventListener("touchmove",yazi,false);
}

  

js-禁止长页面滚动的更多相关文章

  1. js 禁止/允许页面滚动

    参考:https://blog.csdn.net/huangfu_chunfeng/article/details/46429997         https://www.cnblogs.com/w ...

  2. js禁止浏览器页面后退功能

    js禁止浏览器页面后退功能: <script> $(function(){ ) { //防止页面后退 history.pushState(null, null, document.URL) ...

  3. js禁止复制页面文字

    做项目的时候有客户提出要求,不能用用户浏览他发表的文章时复制他的文章 一种比较简单的方法,禁止用户选中页面的文字和禁止用户右键菜单 document.oncontextmenu = new Funct ...

  4. aos.js超赞页面滚动元素动画jQuery动画库

    插件描述:aos.js 是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态 ...

  5. 使用JS方法使页面滚动到指定元素+优化+API介绍(动画)

    前言 当页面最上部有顶部菜单是,使用锚点跳转的方法很容易挡住想要呈现的内容(如下图技能两个字被挡住了一半),为避免出现这样的问题,故滚动到指定元素使用用JS的方法来实现. 目录 使用的API简介 初版 ...

  6. 【VUE/JS】vue和js禁止浏览器页面后退

    1.vue 禁止浏览器后退需求是:需要某个路由不能通过浏览器返回,同时不影响相互之间的切换整理一下解决方法 和 使用方法: 1.在路由配置中给这个路由添加meta信息,比如: { path: '/ho ...

  7. 帆软报表(finereport)JS实现长页面锚点定位

    在报表的应用需求中,页面过长时,需要页面中实现类似HTML中锚点功能以跳转到相应需要预览模块 1实现思路 在设计器中所做的操作最终都会以HTML形式展现在网页.在这里我们为报表块单元格加上id选择器配 ...

  8. JS禁止WEB页面鼠标事件大全

    <!--禁止鼠标右键代码-->:<noscript><ifra:<scriptlanguage=javas:<!--:if(window.Event):doc ...

  9. animate.css配合wow.min.js实现各种页面滚动效果

    有的页面在向下滚动的时候,有些元素会产生细小的动画效果.虽然动画比较小,但却能吸引你的注意.比如刚刚发布的 iPhone 6 的页面(查看).如果你希望你的页面也更加有趣,那么你可以试试 WOW.js ...

随机推荐

  1. python中的@property

    @property 可以将python定义的函数“当做”属性访问,从而提供更加友好访问方式,但是有时候setter/getter也是需要的 class People: def __init__(sel ...

  2. 第二节,下载openwrt源码和编译环境

    文章的开始先说两个重点 1.不要使用root用户编译,普通用户编译即可. 2.自行搭建梯子,以免编译失败. 一,进入虚拟机内的Ubuntu系统 点击左下角的显示应用程序,我们去修改一下Ubuntu的源 ...

  3. 魔咒词典 HDU - 1880 (字符串hash 单hash转int或者 双hash )

    哈利波特在魔法学校的必修课之一就是学习魔咒.据说魔法世界有100000种不同的魔咒,哈利很难全部记住,但是为了对抗强敌,他必须在危急时刻能够调用任何一个需要的魔咒,所以他需要你的帮助. 给你一部魔咒词 ...

  4. 矩阵快速幂 求斐波那契第N项

    #include<cstdio> #include<algorithm> #include<cstring> #include<iostream> us ...

  5. Thymeleaf 模板引擎简介

    目录 Thymeleaf 模板引擎 官方文档下载 Hello World 新建应用 后台控制器 前端页面 浏览器访问测试 Thymeleaf 模板引擎1.Thymeleaf 是 Web 和独立环境的现 ...

  6. 【LuoguP5171】Earthquake

    题目链接 题意 求满足如下不等式的非负整数 \(x,y\) 的对数 \[ax+by\leq c\] Sol a,b,c 都是非负的,那么先随便变个形: \[y\leq\frac{c-ax}{b}\] ...

  7. H5 图片上传

    1.h5 图片异步上传 (1) 异步上传input触发onchange事件的时候,就把图片上传至服务器.后台可能会返回图片的链接等信息,前台可以把图片信息展示给用户看. (2) 另一种情况可能需要前台 ...

  8. MySQL数据库4Python操作mysql、索引、慢查询日志

    目录 一.Python 操作 mysql 1.1python 操作 mysql 1.2查询数据 1.3增加(添加.更新)数据 1.4修改数据 1.5删除数据 1.6SQL注入问题 1.6.1问题的引入 ...

  9. 【leetcode】1129. Shortest Path with Alternating Colors

    题目如下: Consider a directed graph, with nodes labelled 0, 1, ..., n-1.  In this graph, each edge is ei ...

  10. python-unittest生成报告的几种方式

    import unittest suite = unittest.TestSuite() #构造套件 #按测试方法添加 suite.addTest(测试类名('方法名')) suite.addTest ...