更新中。

デバイスのバイブレーション機能を実装できる「Vibration API」

着信やアラームなどでよく使われているバイブレーション機能は、JavaScriptでも実装することが出来ます。ただし、ユーザーがバイブレーション機能をONにしていることが前提条件となりますので注意してください。

バイブレーション機能を実装しよう

<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0">
<title>1秒間のバイブレーションサンプル</title>

<h1>1秒間のバイブレーション</h1>

<script>
navigator.vibrate(1000);
</script>

タップしたらバイブレーションさせよう

<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0">
<title>タップするとバイブレーションを実行するサンプル</title>

<h1 id="tap">ここをタップすると1.5秒間バイブレーションします</h1>
<script>
document.getElementById('tap').addEventListener('touchstart', function(){
  navigator.vibrate(1500);
});
</script>

337拍子バイブレーション

<!DOCTYPE html>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0">
<title>337拍子のバイブレーションサンプル</title>

<h1>337拍子のバイブレーションサンプル</h1>
<p>デバイスのバイブ設定をONにしてください。

<script>
navigator.vibrate([200,150,200,150,200,500,200,150,200,150,200,500,200,150,200,150,200,150,200,150,200,150,200,150,200]);
</script>

参考

執筆者Writer

AnTytle

コメントComment

ログインするとサムネや名前を表示できます。