IOS的移动端/H5/webapp 页面如果滚动到底部或者在页面顶部再往上拉,都会出现一个回弹的效果。

想取消这个效果可以引入一个简单的库就行,不用再写繁琐的样式。

github地址

直接引入就行

<script src="inobounce.js"></script>

例子:

因为这个库是禁止了整个页面的滑动,所以如果页面中有其他元素需要滑动的,要给滑动元素设置一个height或max-height,还有overflow: auto; -webkit-overflow-scrolling: touch;

<style>
ul {
height: 115px;
border: 1px solid gray;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
</style> <ul>
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
<li>List Item 4</li>
<li>List Item 5</li>
<li>List Item 6</li>
<li>List Item 7</li>
<li>List Item 8</li>
<li>List Item 9</li>
<li>List Item 10</li>
</ul>

inobounce.js : 禁止IOS H5的滑动回弹的更多相关文章

  1. IOS的H5页面滑动不流畅的问题:

    IOS的H5页面滑动不流畅的问题: -webkit-overflow-scrolling : touch; 需要滑动的是哪块区域,就在哪里加上这段代码就OK

  2. ios h5 app avalon tap点击事件失效及点击延迟300ms问题解决方法

    1.ios h5 app avalon tap事件失效 使用MUI制作app界面,使用avalon.js渲染数据,发现在(Android上正常)ios上运行时容器div的avalon的ms-on-ta ...

  3. js禁止微信浏览器下拉显示黑底查看网址,不影响内部Scroll

    开发项目跑在微信浏览器经常会遇到一个问题,微信浏览器下拉的时候会出现自带的黑色底色(显示网址)如下图: 网上好多js禁止操作的做法禁止了内部Scroll,导致页面不能滚动,上拉加载失效,例如这种做法: ...

  4. Vue.js 使用 Swiper.js 在 iOS 11 时出现错误

    前言 在H5项目中,需要用到翻页效果,通过 Swiper 来实现,安装 Swiper npm i swiper -S 但是实际使用中,发现低版本 iOS < 11 会出现下面这个错误: Synt ...

  5. [转]js禁止微信浏览器下拉显示黑底查看网址,不影响内部Scroll

    原贴:https://www.cnblogs.com/jasonwang2y60/p/6848464.html 原贴:https://www.cnblogs.com/jasonwang2y60/p/6 ...

  6. 使用 iosOverlay.js 创建 iOS 风格的提示和通知

    iosOverlay.js 用于在 Web 项目中实现 iOS 风格的通知和提示效果.为了防止图标加载的时候闪烁,你需要预加载的图像资源.不兼容 CSS 动画的浏览器需要 jQuery 支持.浏览器兼 ...

  7. Phonegap 之 iOS银联在线支付(js调用ios端银联支付控件)

    Phonegap项目,做支付的时候,当把网站打包到ios或android端成app后,在app上通过wap调用银联在线存在一个问题: 就是当从银联支付成功后,再从服务器返回到app客户端就很难实现. ...

  8. 优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案

    简介 本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发 ...

  9. JS实现IOS风格对话框 jquery / zepto

    Alert alert("这个是一个alert弹窗"); Alert 自定义参数 alert({ content: "自定义alert弹窗", btnText: ...

随机推荐

  1. J2EE学习篇之--JDBC详解

    今天我们来说一下关于JDBC的相关知识,关于JDBC我想大家都不陌生了,而且我记得早就开始使用它了,记得那是大二的时候做课程设计,但是那时候是为了完成任务,所以遇到问题就google,那时候也没有时间 ...

  2. 使用HBuilder编辑器进行真机调试运行时提示Waiting for debugger!

    在使用HBuilder编辑器创建mui项目进行真机调试的时候,手机总是提示Waiting for debugger! 现在终于找到了解决办法: 手机 设置 -> 开发人员选项 -> USB ...

  3. delphi 下载

    获取网络文件大小 //delphi 获取网络文件大小 function GetUrlFileSize(aURL: string): integer; var FileSize: integer; va ...

  4. robotframework 时间控件的操作的几种方法总结。

  5. Jmeter json和正在提取及断言

    Jmeter  json和正在提取及断言 一.提取所需要断言的内容: 响应数据如下:加入需要提取userid为10477的值 { "pub": { , ", " ...

  6. Dubbo入门到精通学习笔记(十六):Keepalived+Nginx实现高可用Web负载均衡

    文章目录 Keepalived+Nginx实现高可用Web负载均衡 Keepalived+Nginx实现高可用Web负载均衡 高可用架构篇 Keepalived + Nginx 实现高可用 Web 负 ...

  7. 高级Java必看的10本书

    1.深入理解Java虚拟机:JVM高级特性与最佳实践 本书共分为五大部分,围绕内存管理.执行子系统.程序编译与优化.高效并发等核心主题对JVM进行了全面而深入的分析,深刻揭示了JVM的工作原理. 2. ...

  8. XVIII Open Cup named after E.V. Pankratiev Stage 5: Eastern Grand Prix

    contest link easy: EI medium-easy: BCDGK medium: L medium-hard: AFH A. Artifacts B. Brackets and Dot ...

  9. 编写一个简单的内核驱动模块时报错 “/lib/modules/3.13.0-32-generic/bulid: 没有那个文件或目录。 停止。”

    编写一个简单的内核驱动模块 static int hello_init() { printk(“hello,I am in kernel now\n”); ; } void addfunc(int a ...

  10. ForEach控制器

    ForEach一般是和用户定义的变量结合使用的 前面前缀一般是和用户定义的变量前缀一致 输出的变量是要使用的变量 这样能保证每次使用的变量不一样 add"_"before numb ...