Un plugin jQuery deosebit de util pe care l-am testat recent într-un proiect este jTip. Deși prezintă câteva limitări de arhitectură, peste acestea se poate trece cu ușurință prin câteva adaptări. Unul dintre marile sale atuuri este dimensiunea redusă a pachetului: aproximativ 3 KB pentru codul JavaScript, 1 KB fișierul CSS și circa 18 KB pentru elementele grafice însoțitoare.
Avantaje și dezavantaje ale pluginului jTip
Iată o sinteză a punctelor forte și a aspectelor ce necesită atenție:
- Avantaj: încarcă indiciile și conținutul casetelor (tooltips) în mod asincron, prin AJAX.
- Dezavantaj: la fiecare eveniment de tip
mouseover, trimite automat o solicitare pentru a încărca resursa. - Dezavantaj: pagina sau fragmentul HTML încărcat este legat direct de atributul
hrefal elementului (situație ce poate fi însă ajustată cu un handler personalizat de click sau un parametru dedicat). - Avantaj: este extrem de simplu de configurat și integrat în orice pagină web.
- Avantaj: amprentă de memorie și lățime de bandă reduse la minimum.
Exemplu de implementare
Pentru a atașa o casetă dinamică unui link, se include scriptul jQuery și biblioteca jTip, iar elementul ancoră se configurează cu clasa corespunzătoare:
<!-- Structura HTML pentru declanșarea casetei jTip -->
<a href="ajax_tooltip.html?width=350" name="Detalii suplimentare" class="jTip" id="exempluTip">
Treceți cu cursorul pentru a vizualiza indiciul
</a>
// jTip preia automat parametrii din href și încarcă conținutul via AJAX:
// ajax_tooltip.html?width=350 -> lățimea casetei devine 350px.
Pentru proiecte web compacte unde este necesară afișarea de informații dinamice fără a îngreuna pagina principală, jTip rămâne o soluție simplă și eficientă.