Kako podesiti pametne telefone i računare. Informativni portal
  • Dom
  • Windows Phone
  • Programiramo pokrete mišem. Pokreti mišem i druge skrivene funkcije kompjuterskog miša

Programiramo pokrete mišem. Pokreti mišem i druge skrivene funkcije kompjuterskog miša

25. februar 2008. u 19:46 Programiranje pokreta mišem
  • JavaScript

Mnogi korisnici Opera i FireFoxa znaju za postojanje tzv. Mouse Gestures (za FF postoji istoimeni dodatak) - pokreta miša na koje preglednik reagira izvođenjem različitih radnji (kao što je otvaranje novog prozora, bookmarks, povratak , naprijed, itd., itd.) itd.), jedina mana ove funkcije je to što nema interakcije s web-mjestom, pa sam odlučio napisati malu biblioteku koja će pomoći programerima da dodaju sličnu funkcionalnost na svoju stranicu. .

Trenutno biblioteka razume samo 8 jednostavnih pokreta:

  • Vrh - držite pritisnutu tipku miša i pomaknite kursor gore 50-200 piksela (podrazumevano) i otpustite, pomak duž X ose treba biti najmanje dva puta manji. nego duž Y ose
  • Dno - pomaknite kursor prema dolje
  • U redu
I njihovi derivati
  • Gornje lijevo - pomak duž X i Y osi ne bi se trebao razlikovati više od dva puta
  • Gore desno
  • Dolje lijevo
  • Dolje desno
Da biste povezali biblioteku, morat ćete dodati sljedeći kod na svoju stranicu:

Zatim kopirajte sljedeći kod:

// koristimo jQuery za funkciju povezivanja na događaj

// postavljamo parametre
navigation.minX = 50;
navigation.minY = 50;
navigation.maxX = 300;
navigation.maxY = 300;
// funkcije povratnog poziva
navigation.TopLeft = funkcija (X,Y) ( );
navigation.Top = funkcija (X,Y) ( );
navigation.TopRight = funkcija (X,Y) ( );
navigacija.Lijevo = funkcija (X,Y) ( );
navigacija. Desno = funkcija (X,Y) ( );
navigation.BottomLeft = funkcija (X,Y) ( );
navigation.Bottom = funkcija (X,Y) ( );
navigation.BottomRight = funkcija (X,Y) ( );


Ovo je predložak za naše "geste", prva dva reda su neophodna da bi se naše dvije funkcije priključile na globalne događaje mousedown i mouseup (koristi se jQuery biblioteka). Sljedeća 4 reda označavaju parametre pokreta, tj. granicama u kojima će funkcionisati. Zatim slijedi deklaracija 8 funkcija povratnog poziva; one uzimaju apsolutne pomake duž X i Y osi kao parametre.

Kako bismo isključili lažne pozitivne rezultate naših funkcija, bolje ih je vezati za pritisnutu tipku “Ctrl” (kod tipke “Ctrl” je 17, ako ga želite promijeniti pogledajte sve kodove na stranici http:/ /unixpapa.com/js/key.html):

$(window).keydown(funkcija(događaj)(
prekidač (event.keyCode) (
slučaj 17:
$(document).mousedown(navigation.mousedown);
$(document).mouseup(navigation.mouseup);
break;
}
});

prekidač (event.keyCode) (
slučaj 17:


break;
}
});

A ovako izgleda kod iz mog primjera:

funkcija mouseGestures())(
$(window).keydown(funkcija(događaj)(
prekidač (event.keyCode) (
//…
// različiti ključevi rade različite stvari
// Različiti pretraživači daju različite kodove
// pogledajte ovdje za detalje: unixpapa.com/js/key.html
//…
slučaj 17:
$(document).mousedown(navigation.mousedown);
$(document).mouseup(navigation.mouseup);
break;
}
});
$(window).keyup(funkcija(događaj)(
prekidač (event.keyCode) (
slučaj 17:
$(document).unbind("mousedown");
$(document).unbind("mouseup");
break;
}
});

Navigation.maxX = 300;
navigation.maxY = 300;
navigation.TopLeft = funkcija (X,Y) ( select($("div#left div.top"),Math.abs(X-Y)) );
navigation.Top = funkcija (X,Y) ( select($("div#center div.top"),Y) );
navigation.TopRight = funkcija (X,Y) ( select($("div#right div.top"),Math.abs(X-Y)) );
navigation.Left = funkcija (X,Y) ( select($("div#left div.middle"),X) );
navigation.Right = funkcija (X,Y) ( select($("div#right div.middle"),X) );
navigation.BottomLeft = funkcija (X,Y) ( select($("div#left div.bottom"),Math.abs(X-Y)) );
navigation.Bottom = funkcija (X,Y) ( select($("div#center div.bottom"),Y) );
navigation.BottomRight = funkcija (X,Y) ( select($("div#right div.bottom"),Math.abs(X-Y)) );
}
izbor funkcije(el,k) (
var brzina = 1500;
prekidač (tačno) (
slučaj (k miš > postavke uređaja (kartica) > kliknite na Synaptics Lux Pad > kliknite na Postavke > kliknite na kliknite > kliknite na ikonu zupčanika pored klika. Tamo ćete vidjeti postavke za omogućavanje/onemogućavanje touchpada.

Najbolji članci na ovu temu