Html5 JS melaksanakan kemahiran tutorial shake function_html5 telefon bimbit

Ciri penting HTML5 ialah DeviceOrientation, yang menyediakan enkapsulasi peringkat tinggi bagi penderia arah dan penderia gerakan asas serta menyediakan sokongan untuk acara DOM. Ciri ini termasuk dua jenis acara:

1. DeviceOrientation: Peristiwa yang merangkum data penderia orientasi dan boleh mendapatkan data orientasi telefon bimbit apabila ia tidak bergerak, seperti sudut, orientasi, orientasi, dll. telefon mudah alih.

2. deviceMotion: peristiwa yang merangkum data penderia gerakan, yang boleh memperoleh data seperti pecutan gerakan apabila telefon bimbit sedang bergerak. Menggunakannya, kita boleh dengan mudah melaksanakan fungsi menarik seperti penderiaan graviti dan kompas, yang akan sangat berguna pada telefon mudah alih. Contohnya, contoh bola pengesan graviti dalam versi percubaan Opera H5 dilaksanakan dengan mendengar acara DeviceOrientation API DeviceOrientation. Malah, ia juga boleh membantu kami melaksanakan fungsi yang sangat biasa dan bergaya dalam aplikasi mudah alih di web: goncang telefon.

DeviceMotionEvent (acara gerakan peranti) mengembalikan maklumat tentang pecutan dan putaran peranti. Data pecutan akan mengandungi tiga paksi: x, y dan z (seperti yang ditunjukkan dalam rajah di bawah, paksi-x berjalan secara mendatar melalui skrin telefon bimbit atau papan kekunci komputer riba, paksi-y berjalan secara menegak melalui skrin telefon bimbit atau papan kekunci komputer riba , dan paksi z adalah berserenjang dengan skrin telefon mudah alih atau papan kekunci komputer riba ). Oleh kerana sesetengah peranti mungkin tidak mempunyai perkakasan untuk mengecualikan pengaruh graviti, peristiwa ini akan mengembalikan dua sifat, pecutanTermasukGraviti (pecutan termasuk graviti) dan pecutan (pecutan), yang kedua tidak termasuk pengaruh graviti.

1. [Kod] Mendengar peristiwa penderiaan gerakan
2 [Kod] Mendapatkan pecutan termasuk graviti
3 [Kod] Kod pelaksanaan kaedah teras

Ciri penting HTML5 ialah DeviceOrientation, yang menyediakan enkapsulasi peringkat tinggi bagi penderia arah dan penderia gerakan asas serta menyediakan sokongan untuk acara DOM. Ciri ini termasuk dua jenis acara:

1. DeviceOrientation: Peristiwa yang merangkum data penderia orientasi dan boleh mendapatkan data orientasi telefon bimbit apabila ia tidak bergerak, seperti sudut, orientasi, orientasi, dll. telefon mudah alih.

2. deviceMotion: peristiwa yang merangkum data penderia gerakan, yang boleh memperoleh data seperti pecutan gerakan apabila telefon bimbit sedang bergerak.
Menggunakannya, kami boleh dengan mudah melaksanakan fungsi menarik seperti penderiaan graviti dan kompas, yang akan sangat berguna pada telefon bimbit. Contohnya, contoh bola sensor graviti dalam versi percubaan Opera H5 dilaksanakan dengan mendengar acara DeviceOrientation bagi DeviceOrientation
API.

Malah, ia juga boleh membantu kami melaksanakan fungsi yang sangat biasa dan bergaya dalam aplikasi mudah alih di web: goncang telefon.

DeviceMotionEvent (acara gerakan peranti) mengembalikan maklumat tentang pecutan dan putaran peranti. Data pecutan akan mengandungi tiga paksi: x, y dan z (seperti yang ditunjukkan dalam rajah di bawah, paksi-x berjalan secara mendatar melalui skrin telefon bimbit atau papan kekunci komputer riba, paksi-y berjalan secara menegak melalui skrin telefon bimbit atau papan kekunci komputer riba , dan paksi z adalah berserenjang dengan skrin telefon mudah alih atau papan kekunci komputer riba ). Oleh kerana sesetengah peranti mungkin tidak mempunyai perkakasan untuk mengecualikan pengaruh graviti, peristiwa ini akan mengembalikan dua sifat, pecutanTermasukGraviti (pecutan termasuk graviti) dan pecutan (pecutan), yang kedua tidak termasuk pengaruh graviti.

1. [Kod] Mendengar acara penderiaan gerakan

Salin kod

Kod adalah sebagai berikut:

if (window.DeviceMotionEvent) {
window.addEventListener('devicemotion',deviceMotionHandler, false);
}

2. Kod] Dapatkan kandungan yang mengandungi Pecutan graviti

Salin kod

Kodnya adalah seperti berikut:

function deviceMotionHandler(eventData) {
var acceleration =eventData.accelerationIncludingGravity;
}

3. [Kod] Kod pelaksanaan kaedah teras

Salin kod

Kod adalah seperti berikut:

var SHAKE_THRESHOLD = xxx;
var last_update = 0;
var x, y, z, last_x, last_y, last_z;

function deviceMotionHandler(eventData) {
var acceleration =eventData.accelerationIncludingGravity;

var curTime = newDate().getTime();

jika ((curTime – lastUpdate)> 100) {

var diffTime = curTime -last_update;
last_update = curTime;

x = pecutan.x;
y = pecutan.y;
z = pecutan.z;

var kelajuan = Math.abs(x y z – last_x – last_y – last_z) / diffTime * 10000;

jika (laju > SHAKE_THRESHOLD) {
amaran(“goncang!”);
}
last_x = x;
last_y = y;
last_z = z;
}
}