…sau “Building An Expanding DHTML Menu With CSS and JavaScript – revisited”.
Despre ce este vorba: despre un meniu vertical cu submeniuri care in prima faza sunt ascunse dar care la rollover se arata.
Cerintele cu care m-am confruntat:
1. La roll-over peste un element de nivel zero sa se afiseze submeniul corespunzator elementului respectiv
2. La roll-over peste un alt element de nivel zero, pe langa efectul de la punctul 1, sa se ascunda orice alt submeniu secundar, ramanand vizibil doar submeniul elementului de meniu in cauza. (sa nu am niciodata mai mult de un submeniu deschis)
Solutia cea mai eleganta am gasit-o in pagina linkata la inceputul articolului, dar era un pic cam pe langa ce-mi trebuia, asa ca am luat-o, am adaptat-o si-am obtinut exact ce-mi trebuie (vezi aici un exemplu functional, cu tot ce-i trebuie ca sa-l intelegi, daca te uiti in sursa).
Later edit: pentru o versiune de meniu mai eleganta (ca si cod/abordare), dar mai putin functionala si fara JS, citeste aici.
English Version of this article here.
Destul de interesant acel link, dar nu prea esti consecvent, mai devreme spuneai de importanata tag-urilor (vezi articolul despre <li> ), cred ca ar fi fost mult mai bine daca ai fi adaptat acel menu, astefel incat sa ai atat menu-ul principal cat si submenu-ul ca o enumerare de elemente (ul, li)
nice 🙂
nu prea imi place ca nu se inchide submeniul atunci cand muti cursorul de pe meniu… dar se poate rezolva presupun 🙂
>:D
alx: la ce anume te referi?
Petru: se pot face multe, evident. in cazul de fata, exact asta s-a vrut, asta s-a obtinut. cate bordeie, atatea obiceie (obiceiuri pentru pruteni).
Dar nu se si inchide… Daca vreau sa inchid submeniul cum fac? Dau refresh…. ar trebui si asta rezolvata… parerea mea..
In rest numai bine si astept posturi cat mai misto de la tine. Spor si poate ne mai vedem si noi la o bere sa punem tara la cale 😉
Mihai: multzam de vorba buna, in primul rand.
Despre ce vrei tu: la sfarsitul codului JS, in loc de
if (last_expanded != id) { obj.className = 'hide'; }scrii doar
That’s all. Conditia aia eu am adaugat-o, tocmai ca sa obtin efectul asta care nu-ti pace tie :p
La sfarsitul codului js daca scrii doar :obj.className = ‘hide’;
nu merge sa se inchida submeniu
De ce nu cauti alta solutie pt a inchide submeniul ca asta nu merge in schimb e super codul si merge bine , numai sa rezolvi problema cu submeniul {Avem voie sa avem alta parere nu }
Teo,
Daca vrei un meniu cu submeniuri care sa se inchida singure la roll-out, am o veste buna pentru tine: tocmai am scris un tutorial pe tema asta, despre cum poti obtine asa ceva. Ce face vestea atat de buna: totul se obtine cu ZERO javascript. Cu alte cuvinte, un cod html super-curat, care la nevoie se degradeaza excelent. Vezi articolul aici.
Totusi la scriptul asta nu poate modificat ca sa se inchida submeniul la roll-out ca e facut misto si e pacat de el ; se customizeaza bine merge super , e ceva simplu si bun , poate se poate rezolva totusi … A ! multumesc pt trimitere eros.nicolau ,dar acela nu e ceea ce caut sorry :((
Si inca ceva {sorry} daca devin deranjant , sa nu uitam ceea ce defapt toti o stim ,faptul ca peste 80% din surferi folosesc IE
necunoscand bineinteles lipsurile acestuia . Eu personal m-a concentrez in principal sa mearga pagina bine in IE dupa care fac probe in restul de browsere . Fie ca ne place sau nu IE este number 1 . Asta e !!! Spun asta pt ca , eros . nicolau , la ce mi-ai dat tu trimitere nu merge prea bine in IE .
🙂 Teo, ma amuzi. Be cool, e de bine.
De acord, fiecare solutie are ajunsuri si neajunsuri. Sper sa le rezolvam pe rand pe toate.
Despre abordarea ta, permite-mi sa-ti spun ca e considerata gresita in general de catre comunitatea de web-rendereri. Abordarea corecta e sa pornesti cu un browser cat mai standards-compliant, sa lucrezi numai in el pana iti iese exact ce vrei, si abia la sfarsit sa introduci hack-urile necesare ca si alte browsere mai stupide sa mearga la fel de bine.
Cauta un pic pe google, si-o sa intelegi de ce.