Menu a tab per siti e blog 2

Pagina 2 di 3

Aggiungere del contenuto di default content alle nostreAjax Tabs

Mentre configurate lo script in modo tale che ogni tabcarichi una pagina estena, potreste anche aver bisogno di unatab che mostri il contenuto che già esiste nellapagina (il famoso “default content) ”:

<div id="ajaxcontentarea"class="contentstyle">
<p>Questo è il testo di default inseritodirettamente nella pagina. E' l'unico testo che nonviene richiamato tramite Ajax</p>
</div>

L’HTML aggiunto dentro al DIV container èil “default content”, e può essere resovisibile anche se lo script non è configurato perselezionare automaticamente alcun tab, oppure se è associato a un determinato tab, in modo tale checliccandola, la tab mostri il suo contenuto. In futuro, perassociare il default content ad una tab, utilizzate lakeyword "#default" al posto del nome fileall’interno dell’elemento <a> per latab che ci interessa, come segue:

<li><a href="#default" rel="contentarea">DHTML</a></li>

Ecco fatto! Potete anche specificare che questo defaultcontent venga selezionato e mostrato in automatico appena lapagina viene caricata(in questo modo viene mostrato inmaniera del tutto automatica), assegnandoall’elemeno<LI> esterno una dichiarazione diclasse class="selected":

<li class="selected"><a href="#default" rel="contentarea">DHTML</a></li>

Sintassi per caricare una pagina esterna:

Come già anticipato, per far sì che una tab– quando viene cliccata- carichi una pagina esterna ,sarà sufficiente scrivere il percorso della pagina checi interessa all’interno della tab.

<li><a href="external.htm" rel="contentarea">DHTML</a></li>

Questo comporta che external.htm si trovi nella stessadirectory dove la pagina contenente le tabs si trova. Poteteutilizzare anche un’URL verso la pagina esterna:

<li><a href="http://www.quellochevolete.com/dir/file.htm" rel="contentarea">DHTML</a></li>z

Non potete, ad ogni modo, specificare una URL che si tropvi al di fuori dal dominio diappartenenza del vostro server, tipo"http://www.google.it/pagina.htm', per motivi disicurezza in Ajax chiamate devno avvenire all’internodello stesso dominio.

Questo metodo, che prevede l’invio dinamico dellapagina da caricare, è configurato in modo tale che loscript - in caso di browsers con JS disabilitato e motori diricerca – si degradi al 100%, consentendo di vedere ilinks come pagine normali.

Selezionare le tabs dinamicamente

Potete selezionare dinamicamente una tab dovunque nellapagina, chiamando il seguente metodo:

expandtab(tabcontentid, tabnumber)

Ad esempio, per creare un link alla terza tab con ULid="maintab" , dovrete ricorrere al seguentecodice:

<a href="javascript: expandtab('maintab', 2)">Seleziona la terza tab di "maintab"</a>

Come avrete certamente notato, il conteggio parte da 0,quindi con 2 si dovrà indicare la terza tab.