移动端ios兼容问题

IOS系统bug:

1)input无法输入的问题:

-webkit-user-select:none;改成-webkit-user-select:auto;

2)滚动不流畅(overflow-y:auto)

-webkit-overflow-scrolling: touch;

注:此属性和overflow-y:auto冲突

原文地址:https://www.cnblogs.com/web-wjg/p/8578987.html

时间: 2024-10-17 22:28:21

移动端ios兼容问题的相关文章

iOS兼容问题-transform

iOS兼容问题-transform 最近在弄一个bug,公司在弄一个阅读器的软件,在阅读页点击下面的导航目录时,目录能够从左至右的方向缓慢出来,用的 transform: translate(255px, 0px) translateZ(0px):  //目录出现 transform: translate(0px, 0px) translateZ(0px);    //目录隐藏 来进行目录的显示和隐藏.在安卓手机能够自由切换,并且页面正常但是在苹果手机上就不行.在苹果手机上进行阅读是点击目录然后

移动端版本兼容js

<!--移动端版本兼容 --> <script type="text/javascript"> var phoneWidth = parseInt(window.screen.width); var phoneScale = phoneWidth/640; var ua = navigator.userAgent; if (/Android (\d+\.\d+)/.test(ua)){ var version = parseFloat(RegExp.$1); /

H5移动端IOS/Android兼容性总结,持续更新中…

H5移动端IOS/Android兼容性总结,持续更新中… 1. IOS不识别日期 new Date("2018-07-01 08:00:00")在Android下正常显示可以直接进行各种操作转化,而在IOS下为invalid date,获取到的时间戳为NaN,确实有点坑啊,只能识别new Date("2018/07/01 08:00:00")这种的,所以需要转化一下,解决方法为统一增加.replace(/-/g,'/'): new Date("2018-0

vue移动端滑动兼容

vue移动端transition兼容 .face-recognition .wrapper(:style="{height: viewHeight+'px'}") .face-recognition{ height: 100%; display: flex; flex-direction: column; position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-color: #ffffff; .wrapp

Clipboard 自动复制功能,ios复制失败,换方案 user-select: text ;长按复制 (ios 兼容,长按复制)

Clipboard 自动复制功能,嵌套app内跳转的页面,ios 自动复制失败(该ios机子,微信,浏览器打开复制没有问题) 暂时换方案    user-select: text ;长按复制 (ios 兼容低版本,长按复制) 最好的 方案是让 app 给出原生复制的 方法.直接调用 可 自动复制 <div class="item-detail"> <div class="line" style>  <!-- user-select: t

移动端 ios 长按复制兼容方案(“偷下懒”,换个思路,也许路就通了)

移动端页面,需要复制一段文字码. 在ios中,长按文字区域,默认选中的范围,超出了我长按的文字区域, 把上面的图片和下面的另一个div的文字也给我包含进来了,并不是我想要的! 举个例子: 如下图: 1.我长按的区域是红色方框内的区域,想要复制框里的文字内容. 2.结果却是下图,即便 ios 上能再稍微操作一下.变成我想要的复制区域,但是这样用户体验太差 3.得想办法长按后 立刻变成如下图的情况 那么,想到了平时在其他站点上用到的一键复制,比如博客园的复制博客里的代码: 查了下有关页面复制功能,发

JS 复制文本兼容移动端 iOS &amp; android

有几个需要注意的地方. 首先文本只有选中才可以复制,所以简单的做法就是创建一个隐藏的 input,然后绑定需要复制的文本. 另外如果将 input 设置为 `type="hidden" 或者 display:none 则无法选中文本,也就无法复制,可以设置 position:absolute;left:-999px; 来隐藏文本域. 静态复制 const copyInput = document.querySelector('#copyInput'); copyInput.value

小技巧css解决移动端ios不兼容position:fixed属性,无需插件

转载自:http://www.ithao123.cn/content-649841.html 移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下几种解决方法 1,使用position:absolute模拟 <script type="text/javascript">     window.onscroll=function(

css解决移动端ios不兼容position:fixed属性,无需插件

移动端开发仿app头部底部固定设置position:fixed,android2.2以上已经实现.但是在ios8以下系统,当小键盘激活时,都会出现位置浮动问题.如图: 如何解决: 查阅资料之后想到一下几种解决方法 1,使用position:absolute模拟 <script type="text/javascript">     window.onscroll=function(){     $(".fixed").css("top"