JS手機振動API vibrate

Eidesen 發布于2019-08-21 10:52 / 2959人閱讀

摘要：判斷兼容瀏覽器對振動的支持情況，一個好的習慣就是在使用之前要檢查一下當前你的應用環境瀏覽器是否支持振動。下面就是檢測的方法在對象里就只有一個關于振動的。

判斷兼容

瀏覽器對振動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方法的調用并不會引起手機循環振動；當參數是一個數字時，振動之后發生一次，然后就停止下來。當參數是數組時，震動會按數組里的值震動，然后就停止振動。

持續震動

我們可以簡單的使用setInterval 和 clearInterval 方法產生讓手機持續震動的效果：

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);
}

上面的這段代碼只是針對振動參數是一個數字的情況，如果參數是數組，你還需要計算一下它的總共持續時間，然后根據它的特征來進行循環。

文檔參考

w3 vibration

MDN Navigator vibrate

云服務器 GPU云服務器 js 調用手機振動 vibrator vibrate Vibration

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/86339.html

虛假來電：HTML5 振動 API 的惡意使用

摘要：到目前為止，以及其他瀏覽器要使用位置信息攝像頭地址簿等資源必須申請權限。目前振動的強度還不能控制，只能控制持續時間。提示是平臺上唯一支持振動的。當頁面使用振動的時候，目前并不會申請權限。一個新的API出來了。HTML5 （很快）將支持用戶設備振動。這明顯是很有趣的事情，比如它可以用戶觸發提醒，提升游戲體驗，以及其他各種好玩的事情，例如通過振動發送摩斯代碼。到目前為止，Chrome...

roland_reed 2019-06-21 16:20 評論0 收藏0
Web Notifications 學習

摘要：據猜測是為瀏覽器翻譯服務。通知內容，顯示在通知標題之下，默認為空字符串標記通知的類型，打上標簽，默認為空字符串。在最新的技術評審稿中，該參數被舍棄設置該標志表示最終用戶將不能很容易地清除。設置該標志，通知將為永久型通知。 Web Notification 網頁通知API。這是2011年由谷歌技術員John Gregg提出的一項網頁通知api。定義請讀者直接參考whatwg工作組對...

Forelax 2019-08-21 15:09 評論0 收藏0