Da alcuni giorni mi capita spesso di dover lavorare con jQuery e visti i plugin e le diverse applicazioni che mi capita di sviluppare, mi è sembrato opportuno postare anche questa libreria; che permette di trasformare un elenco puntato, in un contenitore “ad accesso rapido” o meglio in tab.

jQuery gTab Content - Preview

Ma ora veniamo a noi e passiamo al codice …

Funzionamento del codice:

Nello specifico la funzione è stata implementata per ricevere in input un array, con il quale si possono passare altri parametri personalizzati, al momento l’unico paramentro fondamentale per il corretto funzionamento è

obj: id o classe della lista che si intende trasformare.

function gTab({
obj : '.contentTab'
});

La funzione recupera e imposta l’intestazione come voce del menu laterale. Nasconde i contenuti della lista fino a quando non vengono selezionati come contenuto dell’articolo da visualizzare.

Struttura della lista:

<ul>
<li><h3>Menu #01</h3><p>Testo articolo 1 ...</p>
<li><h3>Menu #02</h3><p>Testo articolo 2 ...</p>
<li><h3>Menu #03</h3><p>Testo articolo 3 ...</p>
[ ... ]
</ul>

Visualizza DEMO
Download: jQuery gTab.zip (122 download)

Lascia un commento