Si të konfiguroni telefonat inteligjentë dhe PC. Portali informativ
  • në shtëpi
  • Windows Phone
  • Ne programojmë gjestet me miun. Gjestet e miut dhe funksionet e tjera të fshehura të një miu kompjuterik

Ne programojmë gjestet me miun. Gjestet e miut dhe funksionet e tjera të fshehura të një miu kompjuterik

25 shkurt 2008 në 19:46 Programimi i gjesteve të miut
  • JavaScript

Shumë përdorues të Opera dhe FireFox dinë për ekzistencën e të ashtuquajturave gjeste të miut (për FF ekziston një shtojcë me të njëjtin emër) - gjeste të miut ndaj të cilave shfletuesi reagon duke kryer veprime të ndryshme (si hapja e një dritare të re, faqerojtësit, mbrapa , përpara, etj., etj.) etj.), e vetmja pengesë e kësaj veçorie është se nuk ka ndërveprim me sitin dhe vendosa të shkruaj një bibliotekë të vogël që do t'i ndihmojë zhvilluesit të shtojnë funksionalitete të ngjashme në faqen e tyre.. .

Për momentin, biblioteka kupton vetëm 8 gjeste të thjeshta:

  • Sipër - mbani të shtypur butonin e miut dhe lëvizni kursorin lart 50-200 piksele (sipas parazgjedhjes) dhe lëshojeni, zhvendosja përgjatë boshtit X duhet të jetë të paktën dy herë më e vogël. sesa përgjatë boshtit Y
  • Fundi - lëvizni kursorin poshtë
  • E drejta
Dhe derivatet e tyre
  • Lart-Left - zhvendosja përgjatë boshteve X dhe Y nuk duhet të ndryshojë më shumë se dy herë
  • Lart djathtas
  • Poshtë-Majtas
  • Poshtë-Djathtas
Për të lidhur bibliotekën, do t'ju duhet të shtoni kodin e mëposhtëm në faqen tuaj:

Më pas, kopjoni kodin e mëposhtëm:

// përdorni jQuery për lidhjen e funksionit me ngjarjen

// vendos parametrat
navigacion.minX = 50;
navigacion.minY = 50;
navigacion.maxX = 300;
navigacion.maxY = 300;
// funksionet e kthimit të thirrjes
navigacion.TopLeft = funksioni (X,Y) ( );
navigacion.Top = funksioni (X,Y) ( );
navigacion.TopRight = funksioni (X,Y) ( );
navigacion.Majtas = funksioni (X,Y) ( );
navigacion.Djathtas = funksioni (X,Y) ( );
navigacion.BottomLeft = funksioni (X,Y) ( );
navigimi.Poshtë = funksioni (X,Y) ( );
navigacion.BottomRight = funksioni (X,Y) ( );


Ky është një shabllon për "gjestet" tona, dy rreshtat e parë janë të nevojshëm për t'i bashkangjitur dy funksionet tona me uljen e miut dhe ngritjen e miut të ngjarjeve globale (përdoret biblioteka jQuery). 4 rreshtat e ardhshëm tregojnë parametrat e gjesteve, d.m.th. kufijtë brenda të cilëve do të funksionojnë. Më pas vjen deklarimi i 8 funksioneve të kthimit të thirrjes; ato marrin kompensime absolute përgjatë boshteve X dhe Y si parametra.

Për të përjashtuar pozitivet e rreme të funksioneve tona, është më mirë t'i lidhni ato me tastin e shtypur "Ctrl" (kodi i tastit "Ctrl" është 17, nëse dëshironi ta ndryshoni, shihni të gjitha kodet në faqen http:/ /unixpapa.com/js/key.html):

$(dritare).keydown(funksion(ngjarje)(
çelësi (ngjarja. kodi i çelësit) (
rasti 17:
$(dokument).mousedown(navigacion.mousedown);
$(dokument).mouseup(navigacion.mouseup);
pushim;
}
});

çelësi (ngjarja. kodi i çelësit) (
rasti 17:


pushim;
}
});

Dhe kjo është se si duket kodi nga shembulli im:

funksioni mouseGestures())(
$(dritare).keydown(funksion(ngjarje)(
çelësi (ngjarja. kodi i çelësit) (
//…
// çelësa të ndryshëm bëjnë gjëra të ndryshme
// Shfletues të ndryshëm ofrojnë kode të ndryshme
// shikoni këtu për detaje: unixpapa.com/js/key.html
//…
rasti 17:
$(dokument).mousedown(navigacion.mousedown);
$(dokument).mouseup(navigacion.mouseup);
pushim;
}
});
$(dritare).keyup(funksion(ngjarje)(
çelësi (ngjarja. kodi i çelësit) (
rasti 17:
$(dokument).unbind("mousedown");
$(dokument).unbind("mouseup");
pushim;
}
});

Navigimi.maxX = 300;
navigacion.maxY = 300;
navigation.TopLeft = funksioni (X,Y) ( zgjidhni($("div#left div.top"),Math.abs(X-Y)) );
navigacion.Top = funksioni (X,Y) ( zgjidhni($("div#center div.top"),Y) );
navigation.TopRight = funksioni (X,Y) ( zgjidhni($("div#right div.top"),Math.abs(X-Y)) );
navigacion.Majtas = funksioni (X,Y) ( zgjidhni($("div#left div.mes"),X) );
navigacion.Djathtas = funksioni (X,Y) ( zgjidhni($("div#djathtas div.mes"),X) );
navigacion.BottomLeft = funksioni (X,Y) ( zgjidhni($("div#left div.bottom"),Math.abs(X-Y)) );
navigacion.Poshtë = funksioni (X,Y) ( zgjidhni($("div#center div.fund"),Y) );
navigation.BottomRight = funksioni (X,Y) ( zgjidhni($("div#right div.bottom"),Math.abs(X-Y)) );
}
zgjidhni funksionin (el,k) (
shpejtësia var = 1500;
kaloni (e vertete) (
rasti (k mouse > cilësimet e pajisjes (skedë) > klikoni në Synaptics Lux Pad > klikoni mbi Cilësimet > Klikoni mbi klikim > klikoni në ikonën e ingranazhit pranë për të klikuar. Aty do të shihni cilësimet për të aktivizuar/çaktivizuar tastierën me prekje.

Artikujt më të mirë mbi këtë temë