专栏首页埋名JS手机振动API vibrate方法

JS手机振动API vibrate方法

判断兼容

浏览器对振动API的支持情况,一个好的习惯就是在使用之前要检查一下当前你的应用环境、浏览器是否支持振动API。下面就是检测的方法:

var supportsVibrate = "vibrate" in navigator;

window.navigator对象里就只有一个关于振动的API:vibrate

振动API基础应用

这个navigator.vibrate函数可以接受一个数字参数,也可以接受一个数字数组,当使用数组参数时,奇数位的数值是震动秒数,偶数位为等待秒数。

// 振动1秒
navigator.vibrate(1000);
// 振动多次
// 参数分别是震动3秒,等待2秒,然后振动1秒
navigator.vibrate([3000, 2000, 1000]);

如果想停止震动,你只需要向navigator.vibrate方法里传入0,或一个空数组:

// 停止振动
navigator.vibrate(0);
navigator.vibrate([]);

navigator.vibrate方法的调用并不会引起手机循环振动;当参数是一个数字时,振动之后发生一次,然后就停止下来。当参数是数组时,震动会按数组里的值震动,然后就停止振动。

持续震动

我们可以简单的使用setIntervalclearInterval 方法产生让手机持续震动的效果:

var vibrateInterval;
// 开始震动
function startVibrate(duration) {
    navigator.vibrate(duration);
}
// 停止震动
function stopVibrate() {    
    // 清除间隔和停止持续振动
    if(vibrateInterval) clearInterval(vibrateInterval);
    navigator.vibrate(0);
}
//在给定的持续时间和间隔时开始持续的振动
//假定一个数字值
function startPeristentVibrate(duration, interval) {
    vibrateInterval = setInterval(function() {
        startVibrate(duration);
    }, interval);
}

上面的这段代码只是针对振动参数是一个数字的情况,如果参数是数组,你还需要计算一下它的总共持续时间,然后根据它的特征来进行循环。

本文分享自微信公众号 - JSdig(jsdigs),作者:埋名

原文出处及转载信息见文内详细说明,如有侵权,请联系 yunjia_community@tencent.com 删除。

原始发表时间:2016-06-11

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Git 常用命令清单笔记

    这里是我的笔记,记录一些git常用和一些记不住的命令,这个笔记原本是基于 颜海镜的文章增加的,后面慢慢增加了许多内容,可以看出的的学习轨迹。分享出来方便自己查看...

    小弟调调
  • 工具武装的前端开发工程师

    刚好获得微信的“原创声明功能”,来实验一下回复功能。前端入坑多年,用过很多的软件和工具,就在此分享给大家一个“老司机”的工具库吧。我现在主要的开...

    小弟调调
  • React UI 组件库【uiw】发布

    高品质的UI工具包,基于React 16+的组件库。 ? 为了表示支持,点击 阅读原文 搞点Star,多多益善。

    小弟调调
  • 如何利用git shell提交代码到github

    在很早之前我根据找到的一些资料以及自己的实践总结了一篇如何将VS2015上的代码上传到GitHub上,后来我发现有小伙伴私信我,说跟我上面写的不一样,但是那段时...

    Masimaro
  • WannaCry勒索病毒详细解读

    2017年5月12日,WannaCry蠕虫通过MS17-010漏洞在全球范围大爆发,感染了大量的计算机,该蠕虫感染计算机后会向计算机中植入敲诈者病毒,导致电脑大...

    FB客服
  • 某 CMS 的漏洞挖掘和分析

    由于种种原因,又拿起了这套 CMS 的源码开始进行审计,代码是两周前下载的,结果现在好多洞的已经修补了(官方版本更新信息上并没有提示安全更新,有点坑)。稍微记录...

    信安之路
  • 【DB笔试面试680】在Oracle中,Undo段存储了哪些内容?

    Redo中只会记录少量信息,这些信息足以重演事务;同样Undo中也只记录精简信息,这些信息足以撤销事务。具体来说:

    小麦苗DBA宝典
  • 十个提升生产力的 bash 技巧

    我喜欢钻研bash环境。很多时候,在使用bash编程中,有些问题一遍又一遍的重复遇到。每次我都需要重新思考这些问题的解决方法。直到有一天我无法忍受,于是坐下来,...

    小小科
  • 360°全方位比较PostgreSQL和MySQL

    https://www.enterprisedb.com/blog/postgresql-vs-mysql-360-degree-comparison

    yzsDBA
  • 那个提出「戴森球」的物理学家去世了

    据纽约时报等外媒报道,传奇的物理学家、伟大的思想家弗里曼·戴森(Freeman Dyson)已于本周去世。

    机器之心

扫码关注云+社区

领取腾讯云代金券