JavaScript knižnica overLIB – popis odkazov na stránke

7. prosince 2000

•

Ak nepatríte k úplným začiatočníkom, určite viete, čo je to alternatívny popis obrázku. Áno, je to ten žltý rámik s textom, ktorý sa objaví pri podržaní kurzora nad obrázkom. Takýmto spôsobom môžeme šikovne okomentovať daný obrázok a pritom nám tento text na stránke nezavadzia. Dnes si ukážeme absolútnu jednotku v popisovaní obrázkov alebo odkazov.

Prečo tento spôsob považujem za absolútnu jednotku? Lebo toho vie oveľa viac ako iné. Je napríklad možné vytvoriť jednoduchý popis takisto ako popis s nadpisom alebo popis, ktorý sa zmení, ak naň klikneme, alebo si môžeme do popisu vložiť HTML kód, alebo zmeniť polohu popisu na od kurzora…

Aby sme mohli takéto popisy používať na svojich stránkach, je potrebné vložiť do dokumentu medzi značky <body>…</body> tieto riadky:

Súbor overlib.js nájdete na stránke http://www.bosrup.com/web/overlib/ (kde sú aj praktické ukážky použitia), čo je oficiálna stránka JavaScript knižnice overLIB. Nájdete tu dve verzie tejto knižnice overlib.js a overlib_mini.js. Rozdiel je iba v tom, že tá „mini“ je zbavená autorových komentárov. Doporučujem používať práve tú „mini“, ktorá má okolo 20 kb. Testoval som obe, dokonca na 16 bitovom Windows, kde upozorňujem na problémy NN, ak je skript väčší ako 20 kb.

Na stránkach overLIB nájdete kompletnú dokumentáciu k používaniu tejto knižnice. Prezradím len, že je možné meniť fonty, farby, používať obrázky a to bez zásahu do externého skriptu. Výhoda spočíva v zadávaní pohyblivého počtu argumentov do funkcie, ktorá sa vyvolá pri udalosti onMouseOver. Ak sa teda rozhodneme použiť len jednoduchý popis, stačí ak funkciu zavoláme iba s jedným argumentom.

<A HREF=“javascript:void(0);“ onMouseOver=“return overlib(‚Toto je jednoduchý popis‘)“ onMouseOut=“nd();“>A tu je ukážka.</A>

Farba, hrúbka orámovania a ostatné parametre sa priradia také, ako sú prednastavené v externom skripte. Ak by sme napr. chceli zmeniť farbu pozadia, orámovania a textu, zdrojový kód by bol nasledovný:

<A HREF=“javascript:void(0);“ onMouseOver=“return overlib(‚Toto je jednoduchý popis‘,BGCOLOR,’black‘,FGCOLOR,’#000099′,TEXTCOLOR,’yellow‘)“ onMouseOut=“nd();“>Ukážka zmeny farieb.</A>

Celkovo môžeme používať viac ako 40 rôznych parametrov, pomocou ktorých si náš popis prispôsobíme podľa našich predstáv.

Aby sme sa naučili aj niečo nové z JavaScriptu, ukážem, ako si taktiež môžete vytvoriť funkciu s viacerými argumentami. JavaScript nám dovoľuje, aby funkcia bola spustená s ľubovoľným počtom argumentov. Nezáleží pritom na názve argumentov definovaných vo funkcii. Teda ak sme si definovali funkciu ako fun(a), môžeme k argumentom tejto funkcie pristupovať aj ako fun.arguments[0]. Na vysvetlenie, arguments[] je pole, ktoré má vlastnosť length, ktorá určuje počet prvkov v tomto poli. Teda fun.arguments.lentgh nám hovorí, s koľkými argumentami bola funkcia fun spustená.

Na ukážku som vytvoril funkciu fun() s pohyblivým počtom argumentov:

Zdrojový kód uvedeného príkladu: