ios系统的css兼容问题处理和iOS上网页滑动不流畅问题
1.H5网页touch滑动的时候在苹果手机上出现不流畅的问题
-webkit-overflow-scrolling 用来控制元素在移动设备上是否使用滚动回弹效果.
解决办法:给所有网页添加如下样式
body {
overflow:auto; /* 用于 android4+,或其他设备 */
-webkit-overflow-scrolling:touch; /* 用于 ios5+ */
}
说明:
-webkit-overflow-scrolling: touch; 当手指从触摸屏上移开,会保持一段时间的滚动
-webkit-overflow-scrolling: auto; 当手指从触摸屏上移开,滚动会立即停止
2. css 苹果手机按钮默认样式如何去掉
input[type="button"], input[type="submit"], input[type="reset"] {-webkit-appearance: none;}
textarea { -webkit-appearance: none;}
3. 如果还有圆角的问题,
.button{ border-radius: 0; }
5、去除Chrome等浏览器文本框默认发光边框
input:focus, textarea:focus {outline: none;}
6.去掉高光样式:
input:focus{-webkit-tap-highlight-color:rgba(0,0,0,0);
-webkit-user-modify:read-write-plaintext-only;}
当然这样以来,当文本框载入焦点时,所有浏览器下的文本框的边框都不会有颜色上及样式上的变化了,这样的话,当文本框载入焦点时,边框颜色就会变为橙色,给用户一个反馈。
7、去除IE10+浏览器文本框后面的小叉叉,只需下面一句就ok了
input::-ms-clear {display: none;}
8.H5页面写出来,在chrome中出现如下错误,只需添加如下css即可解决
.
*{touch-action: pan-y;}
ios系统的css兼容问题处理和iOS上网页滑动不流畅问题的更多相关文章
- 解决iOS上网页滑动不流畅问题
body { overflow:auto; /* 用于 android4+,或其他设备 */ -webkit-overflow-scrolling:touch; /* 用于 ios5+ */ }说明: ...
- iOS系统及客户端软件测试的基础介绍
iOS系统及客户端软件测试的基础介绍 iOS现在的最新版本iOS5是10月12号推出,当前版本是4.3.5 先是硬件部分,采用iOS系统的是iPad,iPhone,iTouch这三种设备,其中iPho ...
- android系统和ios系统是如何实现推送的,ios为什么没有后台推送
ios系统为什么没有后台推送? iOS 为了真正地为用户体验负责,不允许应用在后台活动.有了这个限制,但是对于终端设备,应用又是有必要“通知”到达用户的,随时与用户主动沟通起来的(典型的如聊天应用). ...
- 浅谈Android和IOS系统的差异
总结:事件响应级别.GPU加速.进程前后台.代码运行速度.内存管理机制. 进程管理机制.内存管理机制.cpu效率.GPU加速.事件响应级别. 1. 渲染机制不同 IOS的UI渲染采用实时优先级, ...
- H5在部分苹果手机IOS系统下重力感应无效
原因不明,反正在IOS系统12.2以上的普通的H5移动端网页的重力感应功能无反应 解决方法: 把链接改为HTTPS,经过测试,12.2系统以上的如果你的链接是HTTP的,重力感应在网页上是没调起的,改 ...
- iOS开发之结合asp.net webservice实现文件上传下载
iOS开发中会经常用到文件上传下载的功能,这篇文件将介绍一下使用asp.net webservice实现文件上传下载. 首先,让我们看下文件下载. 这里我们下载cnblogs上的一个zip文件.使用N ...
- ios系统的Date的兼容问题
内容来源网上,自己记录下 问题1: var date =new Date(); 这个是获取当前系统时间的对象,在各端都可以 但是: var date =new Date("2017-01-2 ...
- IOS系统兼容input keyup事件
最近在做移动端模糊搜索功能,js监听input的keyup事件,在chrom模拟器和android手机环境运行都没有问题,到了ios手机却出现bug,没法实现功能: 查了好一会资料,发现keyup事件 ...
- IOS系统不兼容position: fixed;属性的解决方案
position: fixed;属性在IOS系统手机上会有很明显的抖动,解决方式: 只需要在中间部分外层div添加css样式position:fixed;top:50px; bottom:50px;o ...
- uni-app 时间格式问题 new Date(str) IOS系统跟Android系统不兼容
今天做了一个需求,要在列表中把后台返回来的时间给显示出来,使用 new Date(str) 在微信开发者工具上显示是没有问题的,然后在IOS系统上显示是NAN. 原因是 IOS系统只识别 " ...
随机推荐
- #左偏树,树形dp#洛谷 1552 [APIO2012]派遣
题目 分析 那我指定管理层之后,选择薪水越小的人越好, 考虑小根堆,由于需要合并,所以采用左偏树 代码 #include <cstdio> #include <cctype> ...
- MogDB备机处于standby need-repair(WAL)状态
MogDB 备机处于 standby need-repair(WAL)状态 本文出处:https://www.modb.pro/db/402820 问题现象 Mogdb 主备环境,备机检查发现 Sta ...
- 实时 3D 深度多摄像头跟踪 Real-time 3D Deep Multi-Camera Tracking
实时 3D 深度多摄像头跟踪 Real-time 3D Deep Multi-Camera Tracking 论文url https://arxiv.org/abs/2003.11753 论文简述: ...
- 抓包整理————wireshark 抓包[二]
前言 简单整理一些wireshark抓包. 正文 打开wireshark 的capture的option 选项: 然后可以看到可以捕获的选项: 可以看到这里有我的以太网和虚拟机网卡流量. 这个就是将l ...
- js es6 模板字符
前言 es的模板字符,也就是定义了块的概念. 模板字符的二个条件: 1.必须在``中,这个`不是单引号而是反单引号,是tab的上面一个. 2.在#{}中,这个就有点意思了,里面不像后台的块级,在这里不 ...
- native react 代码智能提示
背景 在vscode 中,虽然有插件可以达到代码提示的效果但是不是很嗨. 所以加上这些: 全局安装typings: npm install typings -g 1 安装react和react-nat ...
- c# countDownEvent类
前言 把异步先总结完吧. countDownEvent 这东西是干什么的呢? 比如说我们比赛跑步,我们需要得出的是第一二三名得出后就可以先统计出来,因为比较重要,后面没有获得获奖名次的可以后续统计出来 ...
- 动手实现自己的http服务器【精简版】
1 package v2; 2 3 import java.io.IOException; 4 import java.io.OutputStream; 5 import java.io.PrintS ...
- Vue3.0里为什么要用 Proxy API 替代 defineProperty API
一.Object.defineProperty 定义:Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象 为什么能实现响应式 ...
- Java实现控制台购书系统
"感谢您阅读本篇博客!如果您觉得本文对您有所帮助或启发,请不吝点赞和分享给更多的朋友.您的支持是我持续创作的动力,也欢迎留言交流,让我们一起探讨技术,共同成长!谢谢!" 代码 im ...