Izvorni kontekstni izbornik rijetko se koristi u sučelju web stranice. Uostalom, korisniku uopće nije očito da je na nekom elementu potrebno kliknuti ne lijevom, već desnom tipkom miša i odabrati stavku s popisa. Osim toga, ne vole svi posjetitelji stranice koristiti desnu tipku miša, a na pametnim telefonima ona uopće ne postoji, samo imitacija. Unatoč ovim značajkama, u HTML5 je moguće kreirati vlastite kontekstne izbornike, ovo je do sada implementirano samo u Firefoxu, i to je vrlo neobično.
Prvo, da vidimo kako se općenito stvaraju različite jelovnike. Da biste to učinili, upotrijebite kombinaciju oznaka
Primjer 1: Kontekstni izbornik
HTML5 IE Cr Op Sa Fx
Atribut contextmenu nam govori da je naš izbornik kontekstni izbornik i istovremeno ukazuje na oznaku.
Primjer 2: Izbornik u Firefoxu
Kod se pokazao nevažećim, ali kada kliknete na sliku u Firefoxu, ona se pojavljuje prekrasan jelovnik(Sl. 1).
Riža. 1. Kontekstni izbornik
Dok ovaj izbornik ne radi ispravno, pa promijenimo to. Prvo, dodajmo ikonicu uz stavku izbornika pomoću atributa icon, tako da će izbornik biti ljepši. Vrijednost specificira relativni ili apsolutni put do grafičke datoteke. Zatim se morate pobrinuti da se dogodi neka radnja kada kliknete na stavku izbornika. Da bismo to učinili, koristit ćemo događaj onclick i koristiti ga za poziv željenu funkciju. Primjer 3 prikazuje izradu kontekstni izbornik za tekst, ako u njemu odaberete "Uredi", tada se tekst može uređivati. Zapravo, koristi se skriveno tekstualno polje, koje postaje vidljivo kada se pozove funkcija edit (), dok je sam tekst skriven tijekom uređivanja. Nakon pritiska na Enter, tekst iz forme se umeće na svoje mjesto odlomak teksta, ostavljajući dojam da smo mi ti koji njime vladamo. Obrazac je ponovno skriven nakon dovršetka uređivanja.
Primjer 3: Uređivanje teksta
Ogledni tekst
Pogled na novi izbornik prikazan je na sl. 2.
Riža. 2. Izbornik ikona
Kao što možete vidjeti iz primjera, stvaranje kontekstnog izbornika ne razlikuje se od stvaranja drugih interaktivnih elemenata. Kada se klikne na stavku izbornika, poziva se naša funkcija pomoću rukovatelja onclick, a tada će ova funkcija učiniti ono što želimo. Firefox 8 bio je prvi preglednik koji je podržavao HTML5 kontekstne izbornike, ali je iznenađujuće zašto Firefox programeri uveli vlastitu prilagođenu oznaku za jelovnik . Postoji nekoliko opcija za razvoj događaja:
Ostaje samo čekati odgovor drugih preglednika u kojima je oznaka konačno će biti implementiran, kao i različiti izbornici temeljeni na njemu.
Uputa
Ako se preglednik ne prikaže izbornik, a na ekranu vidite samo odabranu web stranicu, to znači da vaš preglednik radi način rada preko cijelog zaslona. Postoji nekoliko načina da se iz toga izvučete.
Ako je u padajućem izborniku izbornik ne postoji takva naredba, upotrijebite tipkovnički prečac Alt i Enter, koji vam omogućuje prebacivanje na i natrag u mnogim programima. Također u raznim preglednici promjena načina rada vrši se tipkom F11.
Kada ploča više nije skrivena iza gornjeg ruba zaslona, pomaknite kursor na nju i kliknite desnom tipkom miša. Postavite u kontekst izbornik marker nasuprot stavke "Panel izbornik" ili "Niz izbornik” (izraz ovisi o tome koji je preglednik instaliran).
Nakon ovu radnju prozor preglednika trebao bi prikazati standard izbornik bodova. Stavka "Datoteka" omogućuje vam upravljanje prozorom programa, otvaranje i zatvaranje novih prozora i kartica, slanje web stranica na ispis.
Stavka "Uredi" sadrži standardne naredbe "Kopiraj", "Izreži", "Zalijepi", "Pronađi" i ne razlikuje se puno od sličan paragraf u bilo kojem drugom programu. Po izgled prozor preglednika odgovara stavci "Prikaz".
Pristup resursima koje je korisnik spremio provodi se pomoću stavke "Favoriti" ili "Oznake", izbornik"Usluga" ili "Alati" vam omogućuje da prilagodite preglednik svojim potrebama.
Također na ploči izbornik mogu postojati i drugi alati, poput statusne trake, trake favorita, navigacijske trake. Da biste prilagodili njihov prikaz, također pomaknite kursor na ploču, kliknite je desnom tipkom miša i odaberite u kontekstu izbornikželjene stavke označavajući ih markerom.
Izvori:
Broj grupa koje sviraju glazbu svih smjerova od jazza do rap-corea može se procijeniti posjetom jednom klubu. Tijekom večeri na pozornicu izađe i do dva tuceta. Da biste se istaknuli u ovoj masi, nije dovoljno puštati dobru glazbu – potrebno je uložiti u svoju promociju. Ako tim nije spreman odvojiti se od velikog iznosa, morate potražiti pomoć izvana.
Sponzori su skloni partnerstvu sa skupinama koje su već postigle uspjeh. Stoga, prije toga, osvojite dovoljno veliku i stabilnu publiku. Da biste to učinili, osim glazbe, pobrinite se za scenografiju, specijalne efekte, interakciju glazbenika na pozornici, učinite svaku izvedbu malo novom.
Komponirajte organizacije koje se nalaze u vašem području ili na području čije je djelovanje izravno ili neizravno povezano s glazbom. Na drugom popisu navedite ostale organizacije koje nemaju veze s vama. Pomoć može doći s bilo kojeg mjesta, ali počnite s prvim popisom.
Naučiti moguće opcije. Prije kontaktiranja bilo koje organizacije, provjerite je li sponzorirana i na kojem području; jesu li se na njega javljali drugi glazbenici i jesu li odbijeni. Čak i ako vi sami, proučite njegov posao prije donošenja bilo kakve odluke.
Na neko vrijeme postat ćete zaštitno lice organizacije. Stoga, s obzirom na vašu kandidaturu, sponzor će biti vrlo izbirljiv oko vašeg izgleda. Ako niste spremni promijeniti svoj imidž radi usklađenosti, ne računajte na pristanak. Potencijalni sponzor u pravilu ne inzistira na takvoj promjeni, već je jednostavno odbija. Ako ne uzmete u obzir kriterij izgleda, izgubit ćete vrijeme, a možda i priliku za susret s pravim sponzorom.
Nemojte ništa slagati. Svi uvjeti moraju biti navedeni u ugovoru. Razgovarajte o svakoj njegovoj točki s odvjetnikom. Ako vam nešto ne odgovara, nemojte se sramiti zbog toga. Bolje je sada otkriti sve kontroverzne točke nego kasnije gristi laktove zbog vlastite nepažnje.
Slični Videi
Dnevnik "Favoriti" je neophodan kako se ne bi tražili oni resursi kojima korisnik često pristupa svakodnevni rad. Pruža brz pristup do pravih materijala. Da biste pronašli "Favorite", morate izvršiti nekoliko koraka.
"Favoriti" ne postoje samo u preglednicima, već se nalaze iu izborniku bilo koje mape pohranjene na računalu. Budući da je traka izbornika uvijek prisutna u mapama, ne morate ništa dodatno konfigurirati. Otvorite mapu, odaberite stavku "Favoriti" iz izbornika klikom na nju lijevom tipkom miša, otvorit će se kontekstni izbornik. Da biste dodali mapu na popis, odaberite naredbu "Dodaj u favorite" klikom na nju lijevom tipkom miša. Odabrana mapa pojavit će se u izborniku.
Kada radite s internetskim preglednicima, možda ćete morati prilagoditi prikaz trake izbornika ili poseban gumb, s kojim ćete pristupiti časopisu Omiljeni. Da biste to učinili, u Internet Exploreru desnom tipkom miša kliknite ploču, u kontekstnom izborniku odaberite jednu od opcija dostupne opcije. Postavite oznaku ispred stavke "Traka izbornika" - na taj način možete otvoriti "Favorite" na isti način kao što je opisano u prvom koraku.
Ako želite da se knjižne oznake prikazuju na ploči preglednika, odaberite stavku "Favorites Traka" u kontekstnom izborniku, također je označivši markerom. Još jedna alatna traka bit će dodana u prozor preglednika. Ako smatrate da zauzima previše prostora, možete brzo pristupiti prava sredstva i na drugi način. Pritisnite ikonu zvjezdice na alatnoj traci i zapisnik će se proširiti. U njemu odaberite karticu "Favoriti" kako biste vidjeli popis adresa web mjesta pohranjenih u dnevniku.
U pregledniku Mozilla Firefoxčasopis s popisom resursa zove se Bookmarks. Možete ga pozvati preko istoimene stavke u Gornji red izbornika postavljanjem prikaza "Favoriti" na alatnoj traci ili otvaranjem časopisa "Knjižnica". Ovaj dnevnik se poziva na nekoliko načina: odaberite stavku "Oznake" u traci izbornika i naredbu "Prikaži sve oznake" ili pritisnite kombinaciju Tipke Ctrl, Shift i B. Dnevnik će se otvoriti poseban prozor.
Prozor preglednika oblik je grafičkog sučelja koje koristi korisnik prilikom pregledavanja interneta. Istodobno, prozor preglednika dobio je ime zbog činjenice da, poput običnog prozora, ima pravokutni oblik.
Danas je ovaj tržišni segment u stalnoj ekspanziji, pa korisnici imaju priliku birati između više ili manje popularni preglednici ovisno o tome koje im se funkcije i značajke dostupne u svakom od programa čine prikladnijima. Dakle, jedan od najčešće korištenih preglednika dugo vremena je "Internet Explorer", koji je dugo bio vodeći u popularnosti među korisnicima, ali nekoliko drugih zauzima njegovo mjesto danas. zgodni programi, kao što su "Mozilla Firefox", "Opera", " Google Chrome" i drugi.
Jedan od tih parametara je oblik pružanja informacija s web stranice. U svim preglednicima koji danas postoje prikazan je u obliku takozvanog prozora - pravokutnog polja u kojem se prikazuje tekst, slike, video ili druge informacije. Prozor preglednika može se proširiti na Puni zaslon, odnosno njime ispunite cijeli prostor monitora ili koristite komprimirani oblik prikaza prozora klikom na simbol u obliku dva kvadrata s desne strane gornji kut zaslon. Osim toga, prozor koji vam više ne treba možete zatvoriti klikom na simbol križića ili minimizirati, odnosno privremeno ukloniti iz pogleda klikom na simbol crtice.
Svaki prozor preglednika može otvoriti jedan ili više njih dodatne kartice za pristup više web stranica u isto vrijeme. To se može učiniti pomicanjem pokazivača miša na Gornji dio zaslon. U nekim preglednicima ova je značajka prikazana kao simbol plusa, dok je u drugima prikazana kao malo slobodno polje pored naziva već otvorene stranice. Kako bi se zatvorilo zasebna kartica, također morate kliknuti na simbol križa - onaj koji se nalazi na desnoj strani kartice.
Glavni elementi prozora u bilo kojem pregledniku su adresna traka i glavno polje za prikaz informacija. Adresna traka prikazan na vrhu prozora preglednika. Obično počinje znakovima "www" ili "http://" i slovni je kod koji će vas odvesti na stranicu koja vam je potrebna. Trenutno, adrese stranica u Internet koji govori ruski može se upisati i latinicom i ćirilicom. U glavnom polju možete vidjeti najviše različite tekstove, slike, video zapise i druge informacije čiji sastav ovisi o sadržaju stranice koju gledate.
U ovoj lekciji pobliže ćemo pogledati funkcije vrlo koristan ključ, koji se nalazi na bilo kojoj tipkovnici. Ova tipka se zove "tipka kontekstnog izbornika". Nalazi se u donjem desnom dijelu tipkovnice između tipke ALT i CTRL
Kada se ova tipka pritisne, poziva se KONTEKSTNI IZBORNIK, potpuno isto kao da ste pritisnuli DESNU tipku miša.Značajka ovog gumba je da će izbornik koji se pozove kada se pritisne prikazati funkcije (stavke izbornika) koje se mogu primijeniti trenutni program, u aktivni prozor, desktop, itd. Oni. ovaj se izbornik prilagođava procesu u kojem izravno radite i to je vrlo zgodno.Pogledajmo sada pobliže glavne opcije za prikaz kontekstnog izbornika u različitim okruženjima i funkcije koje se mogu izvesti pomoću ovog izbornika.Kada pritisnete DESNU tipku miša ili tipku "Kontekstni izbornik" na radnoj površini Windows radna površina 7 pojavljuje se sljedeći izbornik:
1. Na samom vrhu izbornika - postavljanje parametara vaše video kartice.2. Pogled - podešavanje prikaza ikona na radnoj površini
3. Sortiranje - postavljanje sortiranja prikazivanjem ikona na radnoj površini
4. Osvježi - Osvježava prikaz sadržaja na radnoj površini.5. Zalijepi - ako ste nešto kopirali, možete to zalijepiti na radnu površinu.6. Kreirajte. Ovdje možete kreirati na radnoj površini: mapu, prečac, tekstualni dokument, arhivu, MS Office dokumente - Word, Excel, PowerPoint itd. (ako je instaliran)
7. Razlučivost zaslona. Ovdje možete postaviti potrebne postavke zaslona: odabrati zaslon (može ih biti nekoliko), saznati ili postaviti razlučivost zaslona, odrediti orijentaciju zaslona, a također konfigurirati druge postavke zaslona, na primjer, spojiti projektor.
8. Gadgeti - izbor i instalacija Windows gadgeti 7. Ne postoji takva funkcija u sustavu Windows XP.
9. Personalizacija. Ovdje možete prilagoditi izgled radne površine, promijeniti pozadinu, početni ekran, zvukove, temu, boju prozora itd.
Kada pritisnete DESNU tipku miša ili tipku "Kontekstni izbornik" na datoteci u Exploreru ili bilo kojem drugom upravitelj datoteka izbornik je također prilagođen datoteci određena vrsta. Na primjer, kliknuo sam na video datoteku. Otvara se sljedeći izbornik:
U ovom slučaju, izbornik nudi funkcije koje odgovaraju posebno video datoteci, naime: reprodukcija, dodavanje na popis playera koji je odabran prema zadanim postavkama za ove vrste datoteka. I niz standardnih funkcija: otvaranje pomoću, dodavanje u arhivu (ako je instaliran arhivator), slanje, rezanje, kopiranje, brisanje, preimenovanje i svojstva datoteke.Ako pritisnete DESNU tipku miša ili gumb "Kontekstni izbornik" na grafička datoteka, tada će se otvoriti izbornik koji će odgovarati tipu grafičke datoteke:
Ovdje možete odmah otvoriti, urediti ili ispisati odabranu datoteku u zadanom programu za slike. U mom slučaju to je program ACDSee.Ovdje možete odmah napraviti odabranu datoteku pozadinska slika za stolno računalo, vrlo zgodno pri odabiru veliki popis. A tu su opet standardne funkcije za rad s datotekama.Zadržat ću se detaljnije na točkama "Otvori s" i "Pošalji".Prednosti značajke "Otvori s".
Ovdje možete odabrati ili dodijeliti bilo koji rad s odabranom datotekom instalirani program, koji razumije odabrani format datoteke. U ovom slučaju, kliknuo sam na video datoteku i nekoliko programa može raditi s ovim formatom na mom računalu: Light Allow, WinAmp i naravno Windows Media igrač.Ako popis ne sadrži željeni program, ali sigurno znate da je instaliran, odaberite stavku izbornika "Odaberi program". Windows će od vas tražiti da odaberete programe s popisa preporučenih ili drugih programa. U sustavu Windows XP, izgled ovog prozora je malo drugačiji, ali značenje je isto.
Ako želite da odabrani format datoteke uvijek otvara program koji odaberete, označite potvrdni okvir "Koristi odabrani program za sve datoteke ove vrste".Ako željeni program nije na popisu preporučenih programa ili u drugima, ali sigurno znate da je program instaliran, kliknite gumb "Pregledaj ..." i odaberite ga iz mape u kojoj je program instaliran.Čemu služi funkcija "Pošalji".Koristeći ovu funkciju, možete slati (prijenos, transfer) odabranu datoteku putem BlueTooth (bluetooth), skype, mail, na radnu površinu, arhivirati, pisati na CD/DVD disk, na USB flash disk itd.
I tu se izbornik prilagođava različite situacije, ovisno o tome gdje kliknete na web stranici. Na primjer, ako kliknete na poveznicu, otvorit će se sljedeći izbornik:
Pomoću ovog izbornika možete otvoriti sadržaj veze u novoj kartici ili prozoru, označiti vezu, poslati vezu, kopirati vezu, ako je veza datoteka, možete je spremiti pomoću "Spremi cilj kao.. .". Ako imate instalirane programe za preuzimanje, uz njihovu pomoć možete preuzeti sadržaj poveznice.Ako pritisnete DESNU tipku miša ili tipku "Kontekstni izbornik" na slici na web stranici, otvorit će vam se izbornik s ostalim funkcijama:
Ovdje možete kopirati sliku u međuspremnik i zalijepiti, na primjer, u word dokument, sliku možete spremiti na svoje računalo koristeći "Spremi sliku kao ...", poslati sliku poštom, napraviti odabranu sliku pozadinski uzorak desktop, saznati informacije o slici (vrsta, veličina, naziv datoteke) itd.Da rezimiram. U ovoj lekciji pogledali smo najpopularnije opcije za korištenje kontekstnog izbornika, koji se poziva klikom na DESNU tipku miša ili pritiskom na tipku "Kontekstni izbornik" na tipkovnici.Naime: 1. Pritisnite DESNU tipku miša ili tipku "Kontekstni izbornik" na radnoj površini sustava Windows2. Pritisnite DESNU tipku miša ili tipku "Kontekstni izbornik" na datoteci ili mapi u Exploreru ili bilo kojem drugom upravitelju datotekama.3. Pritiskom na DESNU tipku miša ili tipku "Kontekstni izbornik" u bilo kojem internet pregledniku.suština ovu lekciju je da naučite kako koristiti korisne značajke specifičnog aktivnog okruženja vašeg računala. U bilo kojem okruženju, klikom na DESNU tipku miša ili pritiskom na tipku "Kontekstni izbornik" dobit ćete popis korisne značajke dostupan u ovaj trenutak vrijeme u odnosu na odabrani objekt.
Web aplikacije danas postaju novi korak u razvoju weba. Ovo su daleko od običnih informativnih stranica. Gmail i Dropbox primjeri su naprednih web aplikacija. Kako raste funkcionalnost, dostupnost i korisnost web aplikacija, tako raste i potreba za povećanjem učinkovitosti njihove uporabe. Ovaj će vodič razmotriti stvaranje tako korisne stvari kao što je vaš vlastiti kontekstni izbornik, a posebno:
Na vašem računalu desnim klikom na radnu površinu pojavit će se kontekstni izbornik operacijski sustav. Odavde vjerojatno možete stvarati nova mapa, dobiti neke informacije i učiniti nešto drugo. Kontekstni izbornik u pregledniku omogućuje, na primjer, dobivanje informacija o stranici, pregled njezinog izvornog koda, spremanje slike, otvaranje veze u novoj kartici, rad s međuspremnikom i tako dalje. I set dostupne akcije ovisi o tome gdje ste točno kliknuli, odnosno o kontekstu. Ovo je standardno ponašanje koje su postavili programeri preglednika [ I proširenja za to].
Web aplikacije polako počinju zamjenjivati standardne kontekstne izbornike vlastitim. Gmail i Dropbox izvrsni su primjeri. Jedino pitanje je kako napraviti vlastiti kontekstni izbornik? U pregledniku desni klik pokreće događaj kontekstnog izbornika. Morat ćemo nadjačati zadano ponašanje i učiniti ga tako da umjesto standardni jelovnik izašli su naši. Ovo nije tako teško, ali ćemo to shvatiti korak po korak, tako da će ispasti prilično voluminozno. Za početak ćemo izraditi osnovnu strukturu aplikacije kako primjer koji se razvija ne bi bio potpuno izvan dodira sa stvarnošću.
Primjer rezultata je na CodePen. Tamo možete odmah pogledati ako ste previše lijeni za čitanje ili se želite uvjeriti da vas doista zanima daljnje čitanje. Pa, počnimo razvoj korak po korak začeti. Upotrijebit ću neke moderne CSS trikove i izraditi jednostavan popis obaveza s atributima podataka. Također ću upotrijebiti resetiranje stila Erica Meyera i resetirati svojstvo veličine okvira svih elemenata u graničnom okviru: *, *::before, *::after ( box-sizing: border-box; ) Neću koristiti CSS prefikse, ali demo CodePen uključuje automatski prefiks.
Ali prvo, dodajmo ID u izbornik kako bismo ga lakše dobili putem JS-a. Također dodajte varijabla stanja izbornik menuState i varijabla s aktivnom klasom. Postoje tri varijable: var menu = document.querySelector("#context-menu"); var menuState = 0; var active = "kontekstni izbornik--aktivan"; Idemo dalje. Pogledajmo ponovno funkciju contextMenuListener i dodamo toggleMenuOn za prikaz izbornika: funkcija contextMenuListener(el) ( el.addEventListener("contextmenu", function(e) ( e.preventDefault(); toggleMenuOn(); )); ) funkcija toggleMenuOn() ( if (menuState !== 1) ( menuState = 1 ;menu.classList.add(aktivno); ) ) U ovom trenutku, desnom tipkom miša već možete pozvati naš kontekstni izbornik. Ali ne može se reći da radi ispravno. Prvo, uopće nije tamo gdje bismo željeli. Za rješavanje problema potrebno je malo matematike. Drugo, još nije moguće zatvoriti ovaj izbornik. S obzirom na to kako normalni kontekstni izbornici rade, željeli bismo da se naša implementacija zatvori kada se klikne na izbornik i kada se pritisne Escape. Osim toga, kada desnom tipkom miša kliknete izvan našeg izbornika, trebao bi se zatvoriti, a umjesto toga zahtijeva otvaranje zadanog izbornika. Pokušajmo sve ovo riješiti.
Puno koda
(funkcija() ( "koristi striktno"; ///////////////////////////////////////// /////////////////////// /////////////////////////// ////////// // // FUNKCIJE POMOĆI // POMOĆNE FUNKCIJE // / ///////////////////////////// ///////// ///////////// /////////////////////////// / ** * Ovdje su neke pomoćne funkcije. //////////////////////////////// ////////// ///////// ////////////////////// // // KLJUČNE FUNKCIJE // OSNOVNE FUNKCIJE // //////// ///////// ////////////////////// //////////////////// ///////// /////////// /** * Varijable.* Varijable.*/ var taskItemClassName = "task"; var menu = document.querySelector("#context-menu "); var menuState = 0; var activeClassName = "context-menu--active"; /** * Inicijaliziraj kod naše aplikacije. * Inicijaliziraj kod naše aplikacije. */ function init() ( contextListener(); clickListener( ); keyupListener(); ) /* * * Sluša događaje kontekstnog izbornika.* Rukovanje događajem kontekstnog izbornika.*/ zabava action contextListener() ( ) /** * Osluškuje događaje klikova. * Liječenje kliknite događaje. */ funkcija clickListener() ( ) /** * Osluškuje događaje tipke. * Rukovanje događajem keyup. */ function keyupListener() ( ) /** * Uključuje prilagođeni kontekstni izbornik. * Prikaz kontekstnog izbornika. */ function toggleMenuOn() ( if (menuState !== 1) ( menuState = 1; menu.classList.add(activeClassName); ) ) /** * Pokrenite aplikaciju. * Pokretanje aplikacije. */u tome(); ))();
Funkcija inicijalizacije ostaje ista. Prva promjena utječe na contextListener, jer želimo pohraniti element na koji je korisnik kliknuo u taskItemInContext, a funkcija clickInsideElement ga samo vraća: function contextListener() ( document.addEventListener("contextmenu", function(e) ( taskItemInContext = clickInsideElement(e, taskItemClassName); if (taskItemInContext) ( e.preventDefault(); toggleMenuOn(); positionMenu(e); ) else ( taskItemInContext = null; toggleMenuOff(); ) )); ) Ponovno ga postavljamo na nulu ako desni klik nije bio na stavci popisa. Pa, uzmimo clickListener. Kao što sam ranije spomenuo, radi jednostavnosti, jednostavno ćemo ispisati informacije na konzolu. Sada, kada se uhvati događaj klika, izvrši se nekoliko provjera i izbornik se zatvori. Napravimo prilagodbe i započnimo s obradom klika unutar kontekstnog izbornika, izvođenjem neke radnje i tek nakon toga zatvaranjem izbornika: funkcija clickListener() (document.addEventListener("klik", funkcija(e) ( var clickeElIsLink = clickInsideElement(e, contextMenuLinkClassName); if (clickElIsLink) ( e.preventDefault(); menuItemListener(clickeElIsLink); ) else ( var button = e.koji || e.gumb;ako (gumb === 1) ( toggleMenuOff(); ) ) )); ) Možda ste primijetili da se poziva funkcija menuItemListener. Definirat ćemo ga malo kasnije. Funkcije keyupListener, resizeListener i positionMenu ostale su nepromijenjene. Malo ćemo urediti funkcije toggleMenuOn i toggleMenuOff, mijenjajući nazive varijabli radi bolje čitljivosti koda: funkcija toggleMenuOn() ( if (menuState !== 1) ( menuState = 1; menu.classList.add(contextMenuActive); ) ) funkcija toggleMenuOff() ( if (menuState !== 0) ( menuState = 0; menu.classList .ukloni(contextMenuActive); ) ) Na kraju implementiramo menuItemListener: funkcija menuItemListener(link) ( console.log("Task ID - " + taskItemInContext.getAttribute("data-id") + ", Task action - " + link.getAttribute("data-action")); toggleMenuOff(); ) Time je završen razvoj funkcionalnosti.
Baza kodova za ovaj vodič
