Un meniu contextual personalizat este rar folosit într-o interfață de pagină web. La urma urmei, utilizatorului nu este deloc evident că pe un element este necesar să faceți clic nu cu butonul stânga, ci cu butonul drept al mouse-ului și să selectați un element din listă. În plus, nu tuturor vizitatorilor site-ului le place să folosească butonul drept al mouse-ului, iar smartphone-urile nu îl au deloc, ci doar imitație. În ciuda acestor caracteristici în HTML5, este posibil să vă creați propriile meniuri contextuale, acest lucru este implementat până acum doar în Firefox și este foarte ciudat.
Mai întâi, să vedem cum sunt create în general. diferite meniuri... Pentru aceasta, se folosește o combinație de etichete
Exemplu 1. Meniu contextual
HTML5 IE Cr Op Sa Fx
Atributul contextmenu ne spune că meniul nostru este contextual și, în același timp, indică eticheta
Exemplu 2. Meniuri în Firefox
Codul s-a dovedit a fi invalid, dar când dați clic pe imagine în Firefox, acesta apare meniu frumos(fig. 1).
Orez. 1. Meniu contextual
În timp ce acest meniu nu funcționează calea cea buna deci hai sa o refacem. Mai întâi, să adăugăm o pictogramă lângă elementul de meniu folosind atributul pictogramă, astfel încât meniul să arate mai frumos. Valoarea specifică calea relativă sau absolută către fișierul grafic. Apoi, trebuie să vă asigurați că atunci când faceți clic pe un element de meniu, are loc o acțiune. Pentru a face acest lucru, vom folosi evenimentul onclick și cu ajutorul lui vom suna funcția dorită... Exemplul 3 arată creația meniul contextual pentru text, dacă selectați „Editare” în el, atunci textul poate fi editat. De fapt, se folosește un câmp de text ascuns, care devine vizibil atunci când este apelată funcția de editare (), în timp ce textul în sine este ascuns pe durata editării. După apăsarea Enter, textul din formular este inserat la loc paragraf text, dând impresia că el a fost cel care am condus. Formularul, după finalizarea editării, se ascunde din nou.
Exemplul 3. Editarea textului
Text mostră
Noul meniu este prezentat în Fig. 2.
Orez. 2. Meniu cu pictogramă
După cum puteți vedea din exemplu, crearea unui meniu contextual nu este diferită de crearea altor elemente interactive. Când facem clic pe un element de meniu, funcția noastră este apelată utilizând handlerul onclick, iar apoi această funcție va face ceea ce vrem. Firefox 8 a fost primul browser care a suportat meniuri contextuale HTML5, dar este surprinzător de ce Dezvoltatorii Firefoxși-au introdus propria etichetă personalizată pentru meniu ... Există mai multe scenarii posibile pentru desfășurarea evenimentelor:
Rămâne doar să așteptăm răspunsul altor browsere, în care eticheta vor fi în sfârșit implementate, precum și diferite meniuri bazate pe acesta.
Instrucțiuni
Dacă browserul nu se afișează meniul, și vedeți pe ecran doar pagina de Internet selectată, ceea ce înseamnă că browserul dvs. funcționează modul ecran întreg... Există mai multe moduri de a ieși din ea.
Dacă în meniul derulant meniul nu există nicio comandă dată, utilizați combinația de taste Alt și Enter, care vă permite să mergeți încoace și încolo în multe programe. De asemenea, în diverse browsere schimbarea modului se realizează folosind tasta F11.
Când panoul încetează să se mai ascundă în spatele marginii de sus a ecranului, mutați cursorul pe el și faceți clic dreapta. Setați în context meniul marker de lângă elementul „Panel meniul„Sau” String meniul»(Formularea depinde de ce browser este instalat).
După această acțiune fereastra browserului ar trebui să afișeze standardul pentru meniul puncte. Elementul „Fișier” vă permite să gestionați fereastra programului, să deschideți și să închideți ferestre și file noi, să trimiteți pagini web pentru imprimare.
Elementul „Editare” conține comenzile standard „Copy”, „Cut”, „Paste”, „Find” și nu diferă mult de paragraf similarîn orice alt program. Pe aspect fereastra browserului corespunde articolului „Vizualizare”.
Accesul la resursele salvate de utilizator se realizează folosind elementul „Favorite” sau „Marcaje”, meniul„Serviciul” sau „Instrumente” vă permite să personalizați browserul în conformitate cu nevoile dumneavoastră.
Tot pe panou meniul pot exista și alte instrumente, cum ar fi bara de stare, bara de favorite, bara de navigare. Pentru a le personaliza afișarea, mutați și cursorul pe panou, faceți clic dreapta pe el și selectați în context meniul articolele dorite, marcându-le cu un marker.
Surse:
Numărul de trupe care cântă muzică din toate direcțiile de la jazz la rap-core poate fi evaluat vizitând un club. Până la două duzini ies pe scenă pe seară. Pentru a ieși în evidență pe fondul acestei mulțimi, nu este suficient să cânți muzică bună - trebuie să investești bani în promovarea ta. Dacă echipa nu este pregătită să se despartă de o sumă mare, trebuie să caute ajutor pe partea laterală.
Sponsorii tind să se asocieze cu grupuri care au deja succes. Prin urmare, înaintea ta, câștigă un public destul de mare și stabil. Pentru aceasta, pe lângă muzică, ai grijă de scenografia, efectele speciale, interacțiunea muzicienilor pe scenă, fă fiecare spectacol puțin nou.
Enumerați organizațiile situate în zona sau zona dvs. ale căror activități sunt direct sau indirect legate de muzică. Într-o altă listă, enumerați restul organizațiilor care nu au nicio legătură cu dvs. Ajutorul poate veni din orice direcție, dar începeți cu prima listă.
Studiu opțiuni posibile... Înainte de a contacta orice organizație, verificați dacă aceasta este sponsorizată și în ce zonă; dacă alți muzicieni au contactat-o și dacă a fost refuzată. Chiar dacă ești tu însuți, studiază-i afacerea înainte de a lua orice decizie.
Pentru o vreme, vei deveni chipul organizației. Prin urmare, atunci când vă luați în considerare candidatura, sponsorul va fi foarte pretențios în privința aspectului dvs. Dacă nu sunteți pregătit să vă schimbați imaginea de dragul conformității, nu contați pe consimțământ. De regulă, un potențial sponsor nu insistă asupra unei astfel de schimbări, ci pur și simplu refuză. Daca nu tii cont de criteriul aspectului, atunci vei pierde timp si, eventual, sansa de a te intalni cu un sponsor adevarat.
Nu negociați nimic. Toate condițiile trebuie specificate în contract. Discutați fiecare punct cu un avocat. Dacă ceva nu ți se potrivește, nu te sfiește. Este mai bine să afli acum toate punctele controversate decât să te muști din coate mai târziu din cauza propriei neatenții.
Videoclipuri similare
Revista Favorites este necesară pentru a nu căuta acele resurse la care se referă adesea utilizatorul Munca zilnica... Oferă acces rapid la materialele necesare. Există mai mulți pași pe care trebuie să-i faceți pentru a vă găsi Favoritele.
„Favorite” există nu numai în browsere, ci și furnizate în meniul oricărui folder stocat pe computer. Deoarece bara de meniu este întotdeauna prezentă în foldere, nu trebuie să configurați nimic în continuare. Deschideți folderul, selectați elementul „Favorite” din meniu, făcând clic pe acesta cu butonul stâng al mouse-ului, se va deschide meniul contextual. Pentru a plasa orice folder în listă, selectați comanda „Adăugați la favorite” făcând clic pe el cu butonul stâng al mouse-ului. Dosarul selectat va apărea în meniu.
Când lucrați cu browsere de internet, poate fi necesar să personalizați afișarea barei de meniu sau butonul dedicat, cu care vei avea acces la revista „Favorite”. Pentru a face acest lucru, în Internet Explorer, faceți clic dreapta pe panou, în meniul contextual, selectați unul dintre Optiuni Disponibile... Plasați markerul vizavi de elementul „Bara de meniu” - în acest fel puteți deschide „Preferate” în același mod ca cel descris la primul pas.
Dacă doriți ca marcajele să fie afișate în panoul browserului, selectați elementul „Bara de favorite” din meniul contextual, marcându-l și cu un marcator. O altă bară de instrumente este adăugată în fereastra browserului. Dacă credeți că ocupă prea mult spațiu, puteți accesa rapid resursele potrivite si in alt fel. Faceți clic pe pictograma stea din bara de instrumente, jurnalul se va extinde. Selectați fila „Preferate” din ea pentru a vizualiza lista adreselor site-urilor stocate în istoric.
În browser Mozilla Firefox jurnalul cu lista de resurse se numește „Marcaje”. Îl puteți apela prin articolul cu același nume în linia de sus meniu prin personalizarea afișajului Favoritelor în bara de instrumente sau prin deschiderea revistei Bibliotecă. Acest jurnal poate fi apelat în mai multe moduri: selectați „Marcaje” în bara de meniu și comanda „Afișați toate marcajele” sau apăsați combinația Tastele Ctrl, Shift și B. Jurnalul se va deschide la fereastra separata.
O fereastră de browser este o formă de interfață grafică utilizată atunci când un utilizator folosește Internetul. În același timp, fereastra browserului a primit acest nume datorită faptului că, ca o fereastră obișnuită, are o formă dreptunghiulară.
Astăzi acest segment de piață este în continuă expansiune, astfel încât utilizatorii au posibilitatea de a alege dintre mai multe sau mai puțin browsere populareîn funcție de funcțiile și capacitățile disponibile în fiecare dintre programe, acestea par a fi mai convenabile. Așadar, unul dintre cele mai utilizate browsere de multă vreme este „Internet Explorer”, care pentru o perioadă lungă de timp a fost lider în popularitate în rândul utilizatorilor, dar alții își revendică poziția astăzi. programe convenabile, de exemplu „Mozilla Firefox”, „Opera”, „ Google Chrome" si altii.
Unul dintre acești parametri este forma de furnizare a informațiilor de pe pagina de Internet. În toate browserele existente astăzi, acesta este prezentat sub forma unei așa-numite ferestre - un câmp dreptunghiular în care sunt afișate text, imagini, videoclipuri sau alte informații. Fereastra browserului poate fi extinsă la Ecran complet, adică umpleți întreg spațiul monitorului cu acesta sau utilizați forma condensată a reprezentării ferestrei făcând clic pe simbolul sub forma a două pătrate din dreapta colțul de sus ecran. În plus, o fereastră de care nu mai aveți nevoie poate fi închisă făcând clic pe simbolul în formă de cruce, sau minimizată, adică eliminată temporar din câmpul vizual făcând clic pe simbolul în formă de liniuță.
Fiecare fereastră de browser poate deschide una sau mai multe file suplimentare pentru a accesa mai multe pagini de internet în același timp. Acest lucru se poate face prin mutarea cursorului mouse-ului la partea de sus ecran. În unele browsere această caracteristică este afișată ca un simbol plus, în timp ce în altele este afișată ca un mic câmp liber lângă numele unui site deja deschis. A inchide filă separată, trebuie să faceți clic și pe simbolul crucii - cel din partea dreaptă a filei.
Elementele principale ale ferestrei din orice browser sunt bara de adrese și câmpul principal pentru afișarea informațiilor. Bara de adresa este afișat în partea de sus a ferestrei browserului. De obicei, începe cu caracterele „www” sau „http: //” și este un cod alfabetic care vă va duce la pagina dorită. În prezent, adresele paginilor în Internet vorbitor de limba rusă pot fi tastate atât în fonturi latine cât și chirilice. În câmpul principal, puteți vedea cel mai mult texte diferite, poze, videoclipuri și alte informații, a căror compoziție depinde de conținutul site-ului pe care îl vizualizați.
În acest tutorial, vom arunca o privire mai atentă asupra funcțiilor într-un mod foarte cheie utilă care este disponibil pe orice tastatură. Această tastă se numește „Tasta Meniu contextual”. Este situat în partea dreaptă jos a tastaturii între tastele ALTși CTRL
Apăsând această tastă se afișează MENIU CONTEXT, exact la fel ca și când ați apăsa butonul DREAPTA al mouse-ului.Trucul acestui buton este că meniul apelat atunci când îl apăsați va afișa funcții (articole de meniu) care pot fi aplicate în programul curent, v fereastra activă, pe desktop, etc. Acestea. acest meniu se adaptează la procesul în care lucrați direct și este foarte convenabil.Acum să aruncăm o privire mai atentă la principalele opțiuni de afișare a meniului contextual în diferite medii și la funcțiile care pot fi efectuate folosind acest meniu.Când apăsați butonul DREAPTA al mouse-ului sau tasta „Meniu contextual” de pe desktop desktop Windows 7 apare un meniu după cum urmează:
1. În partea de sus a meniului - setați parametrii plăcii video.2. Vizualizare - personalizați afișarea pictogramelor de pe desktop
3. Sortare - setarea sortării prin afișarea pictogramelor pe desktop
4. Actualizează - Actualizează afișarea conținutului de pe desktop.5. Lipiți - dacă ați copiat ceva, îl puteți lipi pe Desktop.6. Creați. Aici puteți crea pe Desktop: folder, comandă rapidă, document text, arhivă, documente MS Office - Word, Excel, PowerPoint etc. (dacă este instalat)
7. Rezoluția ecranului. Aici puteți seta setările necesare pentru ecran: selectați un ecran (pot fi mai multe dintre ele), aflați sau setați rezoluția ecranului, determinați orientarea ecranului și, de asemenea, configurați alți parametri pentru lucrul cu ecranul, de exemplu, conectați un proiector.
8. Gadget-uri - selecție și instalare gadget-uri Windows 7. Windows XP nu are această caracteristică.
9. Personalizare. Aici puteți personaliza aspectul desktopului, puteți schimba fundalul, ecranul de splash, sunete, tema, culoarea ferestrei etc.
Când apăsați butonul DREAPTA al mouse-ului sau tasta „Meniu contextual” pe un fișier din Explorer sau oricare altul manager de fișiere meniul se adaptează și la fișier de un anumit tip... De exemplu, am făcut clic pe un fișier video. S-a deschis următorul meniu:
În acest caz, meniul oferă funcții care corespund exact fișierului video și anume: redare, adăugare în lista playerului care este selectat implicit pentru de acest tip fişier. Și o serie de funcții standard: deschidere cu, adăugare la arhivă (dacă arhivatorul este instalat), trimitere, tăiere, copiere, ștergere, redenumire și proprietăți ale fișierului.Dacă faceți clic pe butonul DREAPTA al mouse-ului sau pe tasta „Meniu contextual”. fisier grafic, apoi se va deschide un meniu, care va corespunde tipului de fișier grafic:
Aici puteți deschide, edita sau imprima imediat fișierul selectat în programul de imagine implicit. În cazul meu, acesta este programul ACDSee.Aici puteți face imediat fișierul selectat imagine de fundal pentru desktop, este foarte convenabil atunci când alegeți lista mare... Și apoi există din nou funcții standard pentru lucrul cu fișiere.Mă voi opri mai detaliat asupra articolelor „Deschide cu” și „Trimite”.De ce este utilă funcția „Deschide cu”.
Aici puteți selecta sau aloca pe oricare să lucreze cu fișierul selectat programul instalat care înțelege formatul de fișier selectat. În acest caz, am dat clic pe fișierul video și mai multe programe pot funcționa cu acest format pe computerul meu: Light Allow, WinAmp și bineînțeles Windows Media Jucător.Dacă programul necesar nu este în listă, dar știți sigur că este instalat, selectați elementul de meniu „Selectare program”. Windows vă va solicita să selectați programe dintr-o listă de programe recomandate sau alte programe. În Windows XP, aspectul acestei ferestre este ușor diferit, dar sensul este același.
Dacă doriți ca formatul de fișier selectat să fie deschis întotdeauna de programul pe care îl selectați, atunci bifați caseta „Utilizați programul selectat pentru toate fișierele de acest tip”.Dacă programul solicitat nu se află în lista de programe recomandate, sau în altele, dar știți sigur că programul este instalat, atunci faceți clic pe butonul „Răsfoiți...” și selectați-l din folderul în care este instalat programul.De ce este utilă funcția „Trimite”?Cu această funcție, puteți trimite (transfera, transfera) fișierul selectat prin BlueTooth (bluetooth), Skype, mail, pe Desktop, în arhivă, pentru a scrie pe un disc CD/DVD, pe o unitate flash USB, astfel încât să vorbesc etc.
Și aici, meniul se adaptează diferite situatii, în funcție de locul în care dați clic pe pagina web. De exemplu, dacă faceți clic pe link, se va deschide următorul meniu:
Folosind acest meniu, puteți deschide conținutul linkului într-o filă nouă sau într-o fereastră nouă, adăugați linkul la marcaje, trimiteți linkul, copiați linkul, dacă linkul este un fișier, apoi îl puteți salva folosind „ Salvează ținta ca ...". Dacă ai instalat programe pentru descărcare, poți descărca conținutul linkului cu ajutorul acestora.Dacă faceți clic pe butonul DREAPTA al mouse-ului sau pe tasta „Meniu contextual” pe imaginea de pe pagina web, atunci se va deschide un meniu cu alte funcții:
Aici puteți copia imaginea în clipboard și inserați, de exemplu, în document Word, puteți salva imaginea pe computer folosind „Salvare imagine ca...”, trimiteți imaginea prin poștă, creați imaginea selectată model de fundal desktop, aflați informații despre imagine (tip, dimensiune, nume fișier) etc.Lasă-mă să rezum. În această lecție, am examinat cele mai populare opțiuni pentru utilizarea meniului contextual, care este invocat făcând clic pe butonul DREAPTA al mouse-ului sau apăsând tasta „Meniu contextual” de pe tastatură.Și anume: 1. Apăsând butonul DREAPTA al mouse-ului sau tasta „Meniu contextual” de pe desktopul Windows2. Apăsând butonul DREAPTA al mouse-ului sau tasta „Meniu contextual” pe un fișier sau folder din Explorer sau orice alt manager de fișiere.3. Apăsând butonul DREAPTA al mouse-ului sau tasta „Meniu contextual” în orice browser de Internet.Esenta această lecție astfel încât să înveți cum să folosești funcțiile utile ale mediului activ specific al computerului tău. În orice mediu, făcând clic pe butonul DREAPTA al mouse-ului sau făcând clic pe butonul „Meniu contextual”, veți primi o listă funcții utile disponibil in acest moment timp relativ la obiectul selectat.
Aplicațiile web de astăzi devin un nou pas în dezvoltarea web-ului. Acestea sunt departe de site-urile de informare obișnuite. Gmail și Dropbox sunt exemple de aplicații web avansate. Pe măsură ce funcționalitatea, disponibilitatea și utilitatea aplicațiilor web crește, la fel crește și nevoia de a crește eficiența utilizării acestora. Acest tutorial va acoperi crearea unui lucru atât de util precum propriul meniu contextual și, în special:
Pe computer, făcând clic dreapta pe desktop va apărea un meniu contextual sistem de operare... De aici probabil că puteți crea dosar nou, obțineți niște informații și faceți altceva. Meniul contextual din browser permite, de exemplu, să obțineți informații despre pagină, să vizualizați sursele acesteia, să salvați o imagine, să deschideți un link într-o filă nouă, să lucrați cu clipboard-ul și așa mai departe. Mai mult, setul Actiuni valabile depinde de unde ai dat clic, adică de context. Acesta este comportamentul implicit stabilit de dezvoltatorii browserului [ Și extensii ale acestuia].
Aplicațiile web încep încet să înlocuiască meniurile contextuale standard cu propriile meniuri. Gmail și Dropbox sunt exemple excelente. Singura întrebare este cum să vă creați propriul meniu contextual? În browser, clic dreapta declanșează evenimentul meniului contextual. Va trebui să suprascriem comportamentul implicit și să îl facem astfel încât în loc de meniu standard am dedus pe ale noastre. Nu este atât de greu, dar o vom înțelege pas cu pas, așa că va ieși destul de voluminos. Pentru început, să creăm structura de bază a aplicației, astfel încât exemplul dezvoltat să nu fie complet în afara realității.
Un exemplu de rezultat este disponibil pe CodePen. Puteți căuta imediat acolo dacă vă este prea lene să citiți sau doriți să vă asigurați că sunteți cu adevărat interesat de lectură ulterioară. Între timp, să trecem la dezvoltare pas cu pas conceput. Voi folosi câteva trucuri CSS moderne și voi crea o listă de sarcini de bază bazată pe atributele datelor. De asemenea, voi folosi resetarea stilului lui Eric Meyer și voi reseta proprietatea de dimensionare a casetei pentru toate elementele din caseta de margine: *, * :: înainte, * :: după (dimensiunea cutiei: cutie-chenar;) Nu voi folosi prefixe CSS, dar demonstrația CodePen include un prefixer automat.
Dar mai întâi, să adăugăm un ID în meniu pentru a facilita accesul prin JS. De asemenea, adăugați variabilă de stare meniulState și și variabila cu clasa activă. Avem trei variabile: var meniu = document.querySelector ("# meniu contextual"); var menuState = 0; var active = "meniu-contextual - activ"; Să mergem mai departe. Să revizuim funcția contextMenuListener și să adăugăm un toggleMenuOn care afișează meniul: funcția contextMenuListener (el) (el.addEventListener ("menu context", funcția (e) (e.preventDefault (); toggleMenuOn ();));) funcția toggleMenuOn () (dacă (menuState! == 1) (menuState = 1) ; menu.classList.add (activ);)) În acest moment, puteți apela deja meniul nostru contextual cu butonul din dreapta al mouse-ului. Dar nu se poate spune că funcționează corect. În primul rând, nu este deloc acolo unde ne-am dori să fie. Este nevoie de puțină matematică pentru a rezolva problema. În al doilea rând, nu este încă posibilă închiderea acestui meniu. Luând în considerare modul în care funcționează meniurile contextuale obișnuite, am dori ca implementarea noastră să se închidă atunci când facem clic pe un non-meniu și când apăsăm Escape. În plus, când faceți clic dreapta în afara meniului nostru, acesta ar trebui să se închidă și, în schimb, este necesar să deschideți meniul implicit. Să încercăm să rezolvăm toate acestea.
Mult cod
(funcție () ("utilizați strict"; ///////////////////////////////////////////////////////////// ////////////////////////////////// // // FUNCŢII AJUTOR // FUNCŢII AUXILIARE // / //// ////////////////////////////////////////////////////////////////////////////// ///////////////////// / ** * Unele funcții de ajutor aici. * Aici sunt funcțiile de ajutor în sine. * / ////// //// ////////////////////////////////////////////////////////////////////////// ////////////////// // // COREFUNCȚII // FUNCȚII DE PRINCIPALA // ///////////////// //// ////////////////// /////////////////////////////////////////////////// /////// / ** * Variabile. * Variabile. * / Var taskItemClassName = "sarcină"; var meniu = document.querySelector ("# meniu contextual"); var menuState = 0; var activeClassName = "context -menu - activ"; / ** * Inițializați codul aplicației noastre. * Inițializați codul aplicației noastre. * / function init () (contextListener (); clickListener (); keyupListener ();) / * * * Ascultă meniul context evenimente. * Gestionați evenimentele din meniul contextual. * / Distracție ction contextListener () () / ** * Ascultă evenimentele de clic. * Tratament faceți clic pe evenimente... * / funcția clickListener () () / ** * Ascultă evenimentele de tastare. * Gestionarea evenimentului keyup. * / function keyupListener () () / ** * Activează meniul contextual personalizat. * Afișează meniul contextual. * / function toggleMenuOn () (dacă (menuState! == 1) (menuState = 1; menu.classList.add (activeClassName);)) / ** * Rulați aplicația. * Lansarea aplicației. * / init (); )) ();
Funcția de inițializare rămâne aceeași. Prima modificare afectează contextListener, deoarece dorim să stocăm elementul pe care a făcut clic utilizatorul în taskItemInContext, iar funcția clickInsideElement doar îl returnează: funcția contextListener () (document.addEventListener ("menu context", funcția (e) (taskItemInContext = clickInsideElement (e, taskItemClassName); if (taskItemInContext) (e.preventDefault (); toggleMenuOn (); positionMenu (e);) else taskItemInContext = null; toggleMenuOff ();)));) Îl resetam la null dacă clicul dreapta nu a fost pe un element din listă. Ei bine, să trecem la clickListener. După cum am menționat mai devreme, de dragul simplității, vom trimite doar informații către consolă. Acum, la capturarea evenimentului clic, se fac mai multe verificări și meniul este închis. Să facem ajustări și să începem să procesăm clicul din meniul contextual efectuând o acțiune și abia apoi închizând meniul: function clickListener () (document.addEventListener ("click", function (e)) (var clickeElIsLink = clickInsideElement (e, contextMenuLinkClassName); if (clickeElIsLink) (e.preventDefault (); else menuItemListener (clickeElIsLink) e.which || e. .button; dacă (buton === 1) (toggleMenuOff ();))));) Este posibil să fi observat că funcția menuItemListener este apelată. O vom defini puțin mai târziu. Funcțiile keyupListener, resizeListener și positionMenu rămân neschimbate. Vom edita ușor funcțiile toggleMenuOn și toggleMenuOff, schimbând numele variabilelor pentru o mai bună lizibilitate a codului: funcția toggleMenuOn () (dacă (menuState! == 1) (menuState = 1; menu.classList.add (contextMenuActive);)) funcția toggleMenuOff () (dacă (menuState! == 0) (menuState = 0; menu.classList .remove (contextMenuActive);)) În cele din urmă, implementăm menuItemListener: funcția menuItemListener (link) (console.log ("Task ID -" + taskItemInContext.getAttribute ("data-id") + ", Task action -" + link.getAttribute ("data-action")); toggleMenuOff (); ) Aceasta completează dezvoltarea funcționalității.
Baza de cod pentru acest tutorial
