Meniuri flotante in JavaScript

Se poate întîmpla, în crearea unei interfete web, sa doriti ca o parte a acesteia sa fie permanent în atentia utilizatorilor / vizitatorilor. Fie ca este vorba despre logo-ul companiei sau despre un meniu de navigare, este util ca acest element sa ramîna în cîmpul vizual al unei persoane, chiar daca aceasta deruleaza fereastra (browser-ului în acest caz). Solutia pe care am ales-o eu face uz, evident, de JavaScript. In interesul claritatii expunerii si pentru a nu ma pierde în generalitati, voi prezenta o implementare concreta, pe care am si folosit-o în crearea unui site web. Este vorba despre un meniu de navigare, care "urmareste" vizitatorul cînd acesta deruleaza pagina.. Si, dupa cum am amintit, nu este vorba despre folosirea frame-urilor ci a JavaScript. Caci, veti vedea, pozitia nu este statica, ci este calculata pe masura derularii paginii. Inainte de toate, se ridica fireasca întrebare "ce voi construi eu aici?". Reformulez: "cum se numeste dracovenia asta?". Cel mai des un asemenea element este numit sliding toolbar / menu.. Traducerea (si adaptarea) mea ar fi meniu flotant. Si cred ca sintagma acopera scopul si comportarea acestui element. Nu ma pot abtine sa nu exprim si unul dintre cele mai mari regrete ale mele. Veti putea constata si dumneavoastra: realizarea efectiva a unui meniu flotant nu este extrem de complicata. Din pacate, din cauza incompatibilitatilor dintre browsere, asigurarea cadrului de lucru necesita cel putin la fel de multa munca… si mult mai multa testare. In fine, asta e. Ne adaptam conditiilor de lucru. Proiectarea In urma proiectarii am ajuns la urmatoarea configuratie a ferestrei: Dupa cum se poate observa, meniul va fi afisat în partea stânga, iar continutul în partea dreapta. Prezenta banner-ului este optionala, la fel cum optionala este si adaugarea unui banner la baza inferioara a paginii. Daca va întrebati cumva de ce am prevazut în mod express prezenta unui banner, raspunsul e simplu: el poate servi atât pentru identificarea mai clara a paginii curente (poate fi inclus numele paginii, sectiunii), cât si pentru adaugarea banner-elor publicitare (cerinta devenita aproape standard în zilele noastre de Web-economizare). Pentru ca pagina sa fie afisata coerent pe diferite rezolutii, toate elementele vor fi centrate în cadrul ferestrei browserului. Dimensiunile vor fi astfel calculate încât pagina sa nu necesite defilare orizontala nici macar la rezolutia 640x480. Acestea fiind stabilite, sa-i dam drumul. Realizarea Identificarea browserelor se face simplu, prin doua linii de cod: isIE = (document.all) ? 1 : 0; isNS = (document.layers) ? 1 : 0; Este suficienta aceasta identificare, caci nu se folosesc elemente ultra-specifice, care sa se stie ca ridica probleme în diferite versiuni ale browserelor. Asadar, versiunea efectiva nu ne intereseaza (cel putin atît timp cît este peste 3, pentru Netscape si peste 4 pentru Internet Explorer).