Skip to content
💲 Vibration API Wrappers
HTML CoffeeScript JavaScript CSS
Branch: master
Clone or download

Latest commit

Fetching latest commit…
Cannot retrieve the latest commit at this time.

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
build/jquery convert to gplv2 May 26, 2016
docs add script Aug 2, 2014
src convert to gplv2 May 26, 2016
test chaining support for non vibratables Feb 4, 2015
.gitignore init Feb 16, 2014
Gruntfile.coffee convert to gplv2 May 26, 2016
LICENSE.md convert to gplv2 May 26, 2016
README.md Update README.md Jun 23, 2015
bower.json convert to gplv2 May 26, 2016
package.json convert to gplv2 May 26, 2016

README.md

This library was to be published hand-to-hand with my article on the Vibration API. You can also view the documentation.

Does my Device Support the API?

The vibration API is implemented in navigator.vibrate. So calling the function makes your phone vibrate. You can test if your browser is recent enough to have the vibrate function in navigator.

Mozilla had their own implementation mozVibrate so some browsers may support that instead.

var canVibrate = "vibrate" in navigator || "mozVibrate" in navigator;

if (canVibrate && !("vibrate" in navigator))
    navigator.vibrate = navigator.mozVibrate;

However, this doesn't mean that your device can vibrate. Just that it's recent enough. There are a few requirements you need to meet.

  1. You need the hardware for it.
  2. The page needs to be visible.
  3. Browser-specific implementation prevents the vibration.

Usage

jquery.vibrate.js

You can embed using bower with bower install jquery.vibrate.js. Or you can download the zip file and extract the build/jquery/* files.

The javascript files are located in build/jquery/jquery.vibrate.min.js.

Download and embed the code then initialize in one of the following ways.

// Vibration for 50ms on all .button on click
$(".button").vibrate();

// Vibrate for 20ms on click
$(".button").vibrate("short");

// Vibrate for 50ms on click
$(".button").vibrate("medium");
$(".button").vibrate("default");
$(".button").vibrate(50);

// Vibrate for 100ms on click
$(".button").vibrate("long");

// Vibrate for 40ms on touchstart
$(".button").vibrate({
    duration: 40,
    trigger: "touchstart"
});

// Vibrate twice
$(".button").vibrate({
    pattern: [20, 200, 20]
});

Development

I'm using grunt and node for building the docs. Grunt and jasmine for testing. Check out the gruntfile.

You can’t perform that action at this time.