`

禁止IOS 上的web应用全屏显示滚动

阅读更多

if(ua.match(/ipad/i)=="ipad" || ua.match(/iphone/i)=="iphone"){
            //禁止web应用全屏显示时页面可以滚动
            document.ontouchmove = function(e){
                if (document.body.scrollHeight == document.body.clientHeight){
                    event.preventDefault();
                }
            } 
}  

分享到:
评论

相关推荐

    APP软件介绍页面全屏滚动展示特效

    3. 适应性设计:考虑到不同设备的屏幕尺寸和方向,全屏滚动特效应具备良好的响应式布局,保证在各种设备上都能良好显示。 4. 可访问性:遵循无障碍设计原则,确保视觉障碍用户也能通过辅助技术如屏幕阅读器来理解和...

    jQuery仿IOS滚动插件Nicescroll3.zip

    然后,通过在页面元素上应用特定的jQuery选择器和Nicescroll3的初始化方法,即可激活滚动效果。例如: ```javascript $(document).ready(function() { $("html").niceScroll({ cursorcolor: "#00F", // 滚动条...

    iOS 9开发指南 [管蕾 编著] 2015年版(2-2)

    Web视图控件、可滚动视图控件和翻页控件,提醒和操作表,工具栏、日期选择器,表视图,活动指示器、进度条和检索条,UIView,视图控制器,实现多场景和弹出框,UICollectionView和UIVisualEffectView控件,iPad弹出...

    iOS 7 UI Transition Guide

    文档中提到了一个示例应用The Elements在iOS 7和iOS 6模拟器中的不同显示效果,这说明更新UI前必须做好详细规划。 接下来,文档提出了在规划项目时需要考虑的重要内容。它强调了应用程序应该遵循的一些基本规则,并...

    Web开发者和设计师必须要知道的iOS8十个变化.pdf

    2. **滚动事件支持**:iOS 8终于支持了滚动事件,这使得开发者能够更精确地控制页面滚动行为,提高用户体验。 3. **视频增强**:全屏API和元数据API的引入使得视频播放更加灵活,用户可以方便地进行全屏操作,同时...

    ios 网页中图片点击放大效果demo

    4. **图片处理**: 当收到图片点击事件后,iOS应用需要处理图片,通常是下载图片数据,然后利用UIImage来显示。可以使用`NSURLSession`或者`NSData`来下载图片数据,并用`UIImage`的初始化方法创建图片对象。 5. **...

    仿IOS时间选择

    4. CSS和JavaScript:对于Web应用,可以使用CSS和JavaScript来构建仿iOS时间选择器。可以参考现有的CSS框架,如Bootstrap或Materialize,或者使用JavaScript库如`flatpickr`,通过调整样式和配置项使其更接近iOS设计...

    10个优秀视差滚动插件

    它帮助开发者轻松创建带有导航和自动适应不同屏幕尺寸的全屏滚动网站。 6. **OnePageScroll** OnePageScroll模仿iOS应用的滑动效果,为单页网站提供视差滚动功能。它提供了一些内置的选项和方法,便于定制和控制。...

    iOS 9开发指南 2015年版)(2-1)

    Web视图控件、可滚动视图控件和翻页控件,提醒和操作表,工具栏、日期选择器,表视图,活动指示器、进度条和检索条,UIView,视图控制器,实现多场景和弹出框,UICollectionView和UIVisualEffectView控件,iPad弹出...

    个人整理超精密的iOS笔记.pdf

    - **全屏**: 设置视图控制器的 `edgesForExtendedLayout` 属性为 `.none` 可以使视图全屏显示。 - **自动适应父视图大小**: 使用 Auto Layout 或者 Autoresizing Masks 来实现视图自动适应其父视图大小的功能。 ###...

    iOS_Human_Interface_Guidelines中文版,pdf格式,高清版

    文中还强调,设计应为设备量身定制,拥抱iOS界面规范,并确保在不同设备(如iPad和iPhone)上的通用性。开发者还应该重新考虑基于Web的设计,为特定任务定制界面,并不断进行原型和重述以完善设计。 用户体验指南...

    使用HTML5和CSS3构建基于webkit的Web-PageApp.doc

    - `apple-mobile-web-app-capable`:启用全屏模式,使Web App看起来更像原生应用。 - `apple-mobile-web-app-status-bar-style`:控制状态栏颜色或隐藏。 - `viewport`:调整视口大小和缩放行为,优化移动设备显示。...

    uniapp 在线预览pdf

    在移动应用开发领域,uniAPP是一个备受开发者欢迎的框架,它允许开发者使用一套代码,跨平台地构建iOS、Android以及Web应用。而“uniapp在线预览pdf”这个话题,涉及到的是如何在uniAPP中实现PDF文档的在线预览功能...

    前端项目-inobounce.zip

    这个问题通常被称为"iOS WebApp Bounce"或"iOS Safari Overscroll",它发生在全屏模式下Safari浏览器或者在iOS设备上的Web应用中,当用户尝试在内容区域底部或顶部进行过度滚动时,页面会不必要地弹跳回来。...

    IOS手机整站自适应触屏

    8. **Web App模式**:在iOS设备上,可以将网站添加到主屏幕,以“应用”形式运行,此时网页可以利用Web App Manifest文件实现无地址栏和全屏显示,提升用户体验。 9. **性能监控与调试**:利用Safari的开发者工具...

    iPhone WebApp 开发指南

    《iPhone WebApp 开发指南》是一本专注于指导开发者如何创建高效、流畅且具有原生体验的Web应用程序的著作。在iOS平台上,WebApp是一种利用移动Safari浏览器的特性,通过HTML5、CSS3和JavaScript技术构建的应用程序...

    senchatouch在移动设备的应用.pptx

    Sencha Touch 是一个专为构建富移动应用而设计的JavaScript框架,它利用Web标准来创建在各种移动设备上运行的应用程序。这个框架的目标是提供原生应用般的用户体验,同时保持跨平台兼容性。Sencha Touch 支持HTML5的...

Global site tag (gtag.js) - Google Analytics