Napravio sam meni...
http://madlenianum.revolutioninteractive.com/
Pošto nisam JS ekspert (može se reći da sam upućeni početnik) bilo je jako mnogo stranputica na koje sam zaglavljivao. Stvar je daleko od savršene (ima par "tikova") ali definitivno više namam vreme da se posvetim ovome (drugi projekti su onhold zbog ovoga).
Metoda koju je noviKorisnik spomenuo je odradila posao. Kliping nije mogao jer je bilo potrebno očuvati beli border oko podmenija, a i nikako nisam uspevao da ga nateram da radi korektno. Promena dužine radi posao, s napomenom da overflow bloka mora biti hidden kako ne bismo dobili skrolove, prelomljen tekst i slične "sporedne efekte" koje overflow: visible donosi.
Imam još tri "tika" koja moram da rešim i svi su u IEu:
1. Prilikom prelska preko osnovne stavke menija podmeni koji treba da se pojavi dobija klasu toFront, a ostali dobijaju klasu toBack. Prva ima pun opacity i z-index 100 (izbija napred), a druga postaje poluprozirna i povlači se nazad (z-index 1):
Kôd:
#navigation ul li ul.toFront {
z-index: 100;
opacity: 1;
-moz-opacity: 1;
filter: alpha(opacity: 100);
}
#navigation ul li ul.toBack {
z-index: 1;
opacity: 0.5;
-moz-opacity: 0.5;
filter: alpha(opacity: 50);
}
To savršeno korektno radi u Firefoxu (1.5), ali z-index ne radi u Internet Exloreru tj. meniji koji trebaju da se sakriju se ne povlače nazad.
Ima li neko ideju zbog čega se to dešava?
2. Dodatna dva piksela na dnu podmenija... Tu bi trebala da bude bela linija, tj. da poslednja stavka menija "zatvori" blok sa svojim border-bottom. U FF sve u redu, IE brlja...
3. Odvratno treperenje kursora u Exploreru. Znam, timer i opacity su prilično zeznuti, posebno u IEu. Još dodajte tome da je iza Flash objekat... Hteo bih da fiksiram kursor u pointer (hand) bez poščanog sata. Moguće?
PS: Kakva glavolomka. Ne mogu da verujem da sam toliko vremena utrošio na jedan običan meni... No, dobra stvar je što sam naučio par korisnih trikova.