Taburi în pagini web


Există nenumărate soluţii pe web pentru a pune un anumit text împărţit în secţiuni, fiecare secţiune într-un tab. Evident sunt şi soluţii pornind de la jQuery, dar cel puţin implementarea UI/Tabs, cu acele taburi verzi, în IE şi în FF se vede prea ciudat la mine pentru a o lua în calcul. Luni însă DynamicDrive a publicat o soluţie notabilă: scriptul Tab Content. Este de fapt o îmbunătăţire a unui script existent, dar dincolo de aceasta este o implementare robustă ce merge foarte bine cu Firefox (minim 1), Internet Exploer (minim 5) şi Opera (minim 7).

img82

Dacă doriţi să vedeţi scriptul în acţiune, am preluat scriptul DD şi pus mici traduceri iar rezultatul este aici. Puteţi descărca o arhivă cu acel exemplu, care conţine tot ce aveţi nevoie pentru a rula scriptul. Cel mai bine este însă să vedeţi chiar pagina de pe DynamicDrive, unde se găseşte şi o documentaţie detaliată. Care sunt avantajele acestui script?

  • taburile sunt liste, iar conţinutul unui tab este un DIV într-un element de listă
  • se poate specifica tabul iniţial "deschis" (fie prin CSS, fie în mod dinamic)
  • unele taburi pot fi link-uri simple
  • se poate seta să se memoreze tabul deschis, util la revizitarea paginii
  • se pot adăuga mai multe unităţi cu taburi într-o pagină
  • o unitate cu taburi poate fi "pornită" ca un slideshow, asfel încât la câteva secunde se trece automat la tabul următor.

Dacă doriţi cumva ca textul unui tab să fie preluat din surse externe, prin AJAX, vă recomand tot de pe DD scriptul Ajax Tabs Content.

Recent am mai găsit o soluţie pentru taburi care este destul de elegantă şi la fel de simplă: DomTab. Am testat local şi merge bine: îi lipsesc unele facilităţi prezente în soluţia DD, dar tocmai de aceea e şi mai simplu ca implementare. Rămâne Dvs să decideţi spre ce soluţie optaţi după nevoile pe care le estimaţi pentru pagina web cu taburi. Succes!


Apreciază articolul:

1 stea2 stea3 stea4 stea5 stea (1 evaluări, media: 5,00 din 5)
Loading...Loading...

1 comentariu

  1. jürgen.toth spune:

    O solutie de taburi cu ajutorul jquery, idTabs, este prezentata aici. Pentru fiecare exemplu este indicata si sursa, codul, ceea ce usureaza mult preluarea.


Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile necesare sunt marcate *