移动端兼容(2)

1.禁止图片点击放大

部分安卓手机点击图片会放大,如需要禁止放大,只需要设置css属性

img{ 
    pointer-events: none; 
} 

这个会让img标签的点击事件失效,如果想要给图片添加点击事件就要给上面再写一层

2.禁止 iOS 识别长串数字为电话

<meta name="format-detection" content="telephone=no">

3.禁止复制、选中文本

设置CSS属性 -webkit-user-select:none

4.一些情况下对非可点击元素如(label,span)监听点击事件,不会在IOS下触发,css增加cursor:pointer就搞定了

5.上下拉动滚动条时卡顿、慢

body {
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}

Android3+和iOS5+支持CSS3的新属性为overflow-scrolling

6 安卓不会自动播放视频

安卓autoplay没效果 需要手动触发一下
window.addEventListener('touchstart', function(){
	audio.play(); // 需要主动调用一下js 让视频播放
}, false);

7.半透明的遮罩层改为全透明

在ios上,当点击一个链接或者通过js绑定了点击事件的元素时,会出现一个半透明的背景,当手指离开屏幕,该灰色背景消失,出现“闪屏”

html, body {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值