Cuprins
Există multe modalități de a face filele și acordeonele, dar cu siguranță jQuery și pachetul dvs. de bibliotecă UI jQuery ne oferă cel mai rapid și mai eficient mod de a implementa aceste elemente.Gene
Filele ne permit să grupăm informațiile de pe site-ul nostru în funcție de subiect, ceea ce permite utilizatorilor să obțină informații relevante rapid și ușor doar prin selectarea filei dorite.
Metoda tabs ()
Metoda filele(opțiuni) declară că un element al codului HTML și conținutul acestuia trebuie afișate în file, parametrii opțiunilor sunt un obiect care specifică aspectul și comportamentul filelor.
Metoda file () poate fi folosit în două moduri:
• $ (selector, context) .tabs (opțiuni)
• $ (selector, context) .tabs („acțiune”, parametri)
Să vedem un exemplu de implementare a acestuia:
- Includem fișierele necesare, bibliotecile din jQuery si CSS:
- Noi creăm instanța noastră a metodei file () și îl asociem la un selector:
- În cele din urmă, în HTML creăm conținutul care va fi formatat în filele noastre, este important să menționăm că acesta trebuie să respecte structura etichetelorapoi etichetele
- și în cele din urmă etichetepentru metoda de identificare a fiecărei file.
- Nunc tincidunt
- Durerea proin
- Lacinia aeneană
- Includem fișierele necesare, bibliotecile din jQuery si CSS:
- Noi creăm instanța noastră a metodei acordeon () și îl asociem la un selector:
- În cele din urmă, ne creăm HTML-ul respectând structura unei etichetegeneral urmat de alte etichetecare va servi la identificarea fiecărui bloc.
- Creează contÎnscrieți-vă GRATUIT pentru a avea contul SolveticInregistreaza un cont
- IdentificaAi deja un cont? Conectați-vă aiciIdentifică-mă în contul meu
- Publicat 12 august 2013 00:54
- Vizite 3,7K
- NivelProfesional
- Cum se actualizează NPM cu PowerShell în Windows 10
- Cum să trageți și să luați imagini cu UI JQuery
- Cum se creează un spinner sau se încarcă pictograma cu JQuery
- Cum să aveți un site web tradus în mai multe limbi
Să vedem cum arată acest exemplu în browserul nostru:
jQuery UI Tabs - Funcționalitate implicită
Test tab 1.
Morbi tincidunt, dui sit amet facilisis feugiat, I hate metus gravida before, ut pharetra massa metus id nunc. Duis scelerisque enervează turpis. Sete fringilla, massa eget luctus malesuada, metus eros discomfort lectus, ut tempus eros massa ut pain. Aenean aliquet fringilla sem. Suspendisse sed ligula in ligula suscipit aliquam. Praesent in eros vestibulum mi adipiscing adipiscing. Morbi facilisis. Curabitur ornare consequat nunc. Aenean vel metus. Ut posuere viverra nulla. Aliquam erat volutpat. Pellentesque convallis. Maecenas feugiat, tellus pellentesque pretium posuere, felis lorem euismod felis, eu ornare leo nisi vel felis. Mauris consectetur tortor et purus.
Test tab 3.
Acordeon
La fel ca filele, acordeonul organizează informațiile cu particularitatea că o face prin blocuri în care vor fi afișate doar informațiile blocului selectat, în timp ce celelalte rămân ascunse.
Metoda acordeonului ()
Metoda acordeon (opțiuni) specifică faptul că un element din HTML și conținutul său vor fi gestionate ca meniuri de tip acordeon. La fel ca metoda filelor, opțiunile vor specifica comportamentul și aspectul acesteia.
Metoda acordeon () poate fi folosit în două moduri:
• $ (selector, context) .acordion (opțiuni)
• $ (selector, context) .accordion („acțiune”, parametri)
Să vedem un exemplu de implementare a acestuia:
Exemplul nostru va arăta astfel în browser:
Te-a ajutat acest tutorial?
Dacă nuAJUTĂ LA ÎMBUNĂTĂȚIREA ACESTUI TUTORIAL!
Crezi că poți corecta sau îmbunătăți acest tutorial? Puteți trimite ediția cu modificările pe care le considerați utile.0 utilizatori au editat acest tutorial. Editați și deveniți un expert recunoscut!
Editați acest tutorial
TUTORII SIMILARE
Cum să trageți și să luați imagini cu UI JQueryCum se creează un spinner sau se încarcă pictograma cu JQueryPluginuri și biblioteci JQuery pentru dezvoltarea webGrilă dinamică Flexigrid cu JQuery și PHPExpresii regulate cu JqueryGestionarea tabelelor pivot cu pluginul Jquery DatatablesÎnțelegerea AJAX cu jQueryFiltre în selectoare cu Jquery și CSS3 II
Fără comentarii, fii primul!
Nu mai așteptați și intrați în SolveticLasă-ți comentariile și profită de contul de utilizator Alătură-te nouă!informație
Ultimele tutoriale JavaScript
