Deci, primul lucru pe care am inițializa jquery.js bibliotecii. Este de dorit să se conecteze la secțiunea
Document:Aici vom face următoarele lucruri:
- când arborele documentului DOM este gata, acesta este rulat într-o buclă peste toate sub-meniu (ul #-ul meniul meu);
- în fiecare iterație, vom atribui link-ul de clasă „pliabil“, care este responsabil pentru acest submeniu;
- aceeași legătură atribuie o tratare a evenimentului „clic“, care, în funcție de starea submeniului va dezvălui sau ascunde.
- se întoarce onlick „fals“, astfel că nu a avut loc ca urmare a unui link.
Să încercăm să poke la rezultatul:
Cred că atunci când te ascunzi, de exemplu, sub-meniu „Produse“ și apoi deschideți - sub-filială trebuie să fie închise, indiferent de ce poziție au fost înainte. Prin urmare, adăugați apel invers-funcția metoda slideUp are următoarea linie:
În principiu, meniul gata. Cu toate acestea, puteți închide o pereche de widget-uri mici. De exemplu, implementat meniul de stocare de deschidere în a merge la alte pagini. Facem acest lucru printr-un cookie. Sensul este - atunci când se deschide meniul, într-un cookie este stocat notația de forma „submenuMark-xx = deschis“, unde xx - numărul de serie (index) al acestui submeniu în lista submeniul. Prin urmare, atunci când sunt închise - intrare se elimină din cookie.
Pentru a lucra cu cookie-ul va fi ușor de utilizat jquery.cookie.js plugin. Descărcați-l și conectați lângă jquery. Acum să scrie câteva funcții utile pentru lucrul cu cookie-ul:
Când este încărcat documentul, trebuie să vedem ce submeniul marcat în cookie-uri și să le deschidă. Prin urmare, se introduce următoarea bucată de cod pentru a bucla prin toate podmenyushkam:
După cum vedeți, acum avem un CSS-clase „extins“, „sa prăbușit“ și „pliabil“ - astfel încât să puteți infrumuseta un pic meniul nostru cu CSS.
Iar ultima atingere - oriunde în codul nostru se deschide sau închide un submeniu, plasați apelul corespunzător funcției cookie. Că eu nu am de gând să descrie - puteți vedea în script-ul terminat. Deci, uita-te la meniul finit:
Salvarea poziției meniului într-un cookie, puteți verifica dacă împungere pe link-urile și reîncărcați pagina - submeniul va păstra statutul lor.
Vezi codul sursă poate fi în fișierul atașat. Mult noroc!