关于js的一些怪异问题的解决方式

1、安卓手机图片抖动:

-webkit-backface-visibility: hidden;

-webkit-perspective: 1000;

2、手机端无点击效果

-webkit-tap-highlight-color: transparent;

-webkit-touch-callout: none;

user-select: none;

3、js 乘法问题

$scope.shangzheng.toFixed(2) *$scope.shenzheng.toFixed(2)

4、版本检测

var initStyle = window.getComputedStyle(el);

if (initStyle.position === '-webkit-sticky' || initStyle.position === 'sticky') return;

还有 JS 的话 比如检测是否支持 fetch 就检测 if (window.fetch)

functiongetAndroidVersion(ua) {

varua = ua || navigator.userAgent;

varmatch = ua.toLowerCase().match(/android\s([0-9\.]*)/);

returnmatch ? match[1] :false;

};

getAndroidVersion();//"4.2.1"

parseInt(getAndroidVersion());//4

parseFloat(getAndroidVersion());//4.2

5、判断是否来自微信界面: /MicroMessenger/i.test(navigator.userAgent)

6、touch-action: manipulation; 长按不会被选中。

auto

当触控事件发生在元素上时,由浏览器来决定进行哪些操作,比如对viewport进行平滑、缩放等。

none

当触控事件发生在元素上时,不进行任何操作。

pan-x

如果当前元素最近的父元素可以横向滚动时,浏览器只允许在该父元素上进行横向滚动。

pan-y

如果当前元素最近的父元素可以纵向滚动时,浏览器只允许在该父元素上进行纵向滚动。

manipulation

浏览器只允许进行滚动和持续缩放操作。任何其它被auto值支持的行为不被支持。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,814评论 1 92
  • 常见试题 行内元素:会在水平方向排列,不能包含块级元素,设置width无效,height无效(可以设置line-h...
    他大舅啊阅读 2,498评论 1 5
  • Meta 基础知识: H5 页面窗口自动调整到设备宽度,并禁止用户缩放页面。 空白页基本 meta 标签 其他 m...
    Dimen_阅读 1,019评论 2 4
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 3,567评论 1 19
  • 由于学校宿舍翻修,我们四个女生临时搬到市郊一个废弃很久的四合院里住。黄昏中,我看着院内斑驳的一切,心中不禁弥漫着...
    小手乱写阅读 238评论 0 1