js-禁止长页面滚动
标题的需求问题其实我经常遇到。尤其是在碰到页面同时出现有视频及弹层的情况。
当然我说的问题皆是针对微信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-禁止长页面滚动的更多相关文章
- js 禁止/允许页面滚动
参考:https://blog.csdn.net/huangfu_chunfeng/article/details/46429997 https://www.cnblogs.com/w ...
- js禁止浏览器页面后退功能
js禁止浏览器页面后退功能: <script> $(function(){ ) { //防止页面后退 history.pushState(null, null, document.URL) ...
- js禁止复制页面文字
做项目的时候有客户提出要求,不能用用户浏览他发表的文章时复制他的文章 一种比较简单的方法,禁止用户选中页面的文字和禁止用户右键菜单 document.oncontextmenu = new Funct ...
- aos.js超赞页面滚动元素动画jQuery动画库
插件描述:aos.js 是一款效果超赞的页面滚动元素动画jQuery动画库插件.该动画库可以在页面滚动时提供28种不同的元素动画效果,以及多种easing效果.在页面往回滚动时,元素会恢复到原来的状态 ...
- 使用JS方法使页面滚动到指定元素+优化+API介绍(动画)
前言 当页面最上部有顶部菜单是,使用锚点跳转的方法很容易挡住想要呈现的内容(如下图技能两个字被挡住了一半),为避免出现这样的问题,故滚动到指定元素使用用JS的方法来实现. 目录 使用的API简介 初版 ...
- 【VUE/JS】vue和js禁止浏览器页面后退
1.vue 禁止浏览器后退需求是:需要某个路由不能通过浏览器返回,同时不影响相互之间的切换整理一下解决方法 和 使用方法: 1.在路由配置中给这个路由添加meta信息,比如: { path: '/ho ...
- 帆软报表(finereport)JS实现长页面锚点定位
在报表的应用需求中,页面过长时,需要页面中实现类似HTML中锚点功能以跳转到相应需要预览模块 1实现思路 在设计器中所做的操作最终都会以HTML形式展现在网页.在这里我们为报表块单元格加上id选择器配 ...
- JS禁止WEB页面鼠标事件大全
<!--禁止鼠标右键代码-->:<noscript><ifra:<scriptlanguage=javas:<!--:if(window.Event):doc ...
- animate.css配合wow.min.js实现各种页面滚动效果
有的页面在向下滚动的时候,有些元素会产生细小的动画效果.虽然动画比较小,但却能吸引你的注意.比如刚刚发布的 iPhone 6 的页面(查看).如果你希望你的页面也更加有趣,那么你可以试试 WOW.js ...
随机推荐
- 华为设备acl配置
拓扑图: 需求: 1.-vlan10内所有的主机,只能通过http访问vlan30-server的服务器;不能访问vlan40-server服务器2.-vlan20-pc1主机,可以访问vlan40- ...
- vb6中word编程总结
1,在project\references 中加入microsoft word 9.0 object library 2, 启动word Dim wApp As Word.Application ...
- hdu 5890 01背包 bitset
注意不能每个T都mem 不然会T #include <bits/stdc++.h> #define PI acos(-1.0) #define mem(a,b) memset((a),b, ...
- Effective C++条款05:了解C++默默编写并调用哪些函数
class Empty{}; class Empty{ Empty(){}; Empty(const Empty& rhs){}; ~Empty(){}; Empty& operato ...
- vue 之 双向绑定原理
一.实现双向绑定 详细版: 前端MVVM实现双向数据绑定的做法大致有如下三种: 1.发布者-订阅者模式(backbone.js) 思路:使用自定义的data属性在HTML代码中指明绑定.所有绑定起来的 ...
- 使用Vscode添加中文汉化插件
一.首先打开Vscode,找到该软件的扩展,如下: 二.点击扩展按钮之后,会出现如下的界面,有一个扩展搜索输入框,输入chinese之后,会随之产生一些匹配的插件 三.重启一下Vscode,然后就看到 ...
- easyui自学模板代码
index.jsp源码 <%@ page language="java" contentType="text/html; charset=UTF-8" p ...
- pyautogui页面点击和键盘输入
以下程序实现了在编辑框处点击,然后用键盘输入的功能 import pyautogui import time time.sleep(10) currentMouseX, currentMouseY = ...
- hihocoder 1582 : Territorial Dispute (计算几何)(2017 北京网络赛E)
题目链接 题意:给出n个点.用两种颜色来给每个点染色.问能否存在一种染色方式,使不同颜色的点不能被划分到一条直线的两侧. 题解:求个凸包(其实只考虑四个点就行.但因为有板子,所以感觉这样写更休闲一些. ...
- linux运维、架构之路-python2.6升级3.6
一.环境 1.系统 [root@m01 ~]# cat /etc/redhat-release CentOS release 6.9 (Final) [root@m01 ~]# uname -r -. ...