Javascript-js tutorial

Source: Internet
Author: User
A new API is available. HTML5 (soon) will support User device vibration. This is obviously a very interesting thing. For example, it can trigger a reminder to improve the gaming experience. The following small series will help you sort out the javascript mobile phone vibration api, users who need it can refer to the new APIs provided by modern browsers and are more and more inclined to mobile phone applications, rather than traditional desktop applications, such as the javascript geographic location information API. Another JavaScript API that only targets mobile apps is the Vibration API. Obviously, this API allows mobile programmers to use JavaScript to call the mobile phone's vibration function and set the vibration mode and duration.

Determine the browser's support for the vibration API
A good habit is to check whether your application environment and browser support the vibration API before using it. The following is the detection method:

The Code is as follows:


// Standards ftw!
Var supportsVibrate = "vibrate" in navigator;


There is only one vibration API in the window. navigator object: vibrate.

Basic Application of Vibration API
This navigator. vibrate function can accept either a numeric parameter or a numeric array. When an array parameter is used, the odd digit value is the number of seconds of vibration, and the even digit is the number of seconds of waiting.

// Vibration: 1 second

The Code is as follows:


Navigator. vibrate (1000 );


// Multiple vibrations
// The parameters are vibrate for 3 seconds, wait for 2 seconds, and then vibrate for 1 second.

The Code is as follows:


Navigator. vibrate ([3000,200 0, 1000]);


To stop the vibration, you only need to input 0 or an empty array to the navigator. vibrate method:

// Stop Vibration

The Code is as follows:


Navigator. vibrate (0 );
Navigator. vibrate ([]);


It should be noted that the call to the navigator. vibrate method does not cause cyclic vibration on the mobile phone. When the parameter is a number, the vibration occurs once and then stops. When the parameter is an array, the vibration will vibrate according to the value in the array and then stop the vibration.

Continuous Vibration
We can use the setInterval and clearInterval methods to make the phone vibrate continuously:

var vibrateInterval;// Starts vibration at passed in levelfunction startVibrate(duration) {navigator.vibrate(duration);}// Stops vibrationfunction stopVibrate() {// Clear interval and stop persistent vibrating if(vibrateInterval) clearInterval(vibrateInterval);navigator.vibrate(0);}// Start persistent vibration at given duration and interval// Assumes a number value is givenfunction startPeristentVibrate(duration, interval) {vibrateInterval = setInterval(function() {startVibrate(duration);}, interval);}

The above code is only for the case that the vibration parameter is a number. If the parameter is an array, you also need to calculate the total duration of the parameter and then cycle it according to its features.

Scenarios using Vibration APIs
This API is intended for mobile phone devices. When developing mobile WEB apps, mobile apps are a good warning tool. When developing Web games or multimedia apps, this vibration function is an indispensable technology. For example, when a user is playing your WEB game on a mobile phone, when the game is exploding, and you let the mobile phone also follow the vibration, is it a very good user experience?

How do you feel about this JavaScript vibration API? Do you think it will soon become popular? Still not very useful?

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.