menu orizontali...

[agis]

Salve a tutti..
Vorrei sapere come posso fare a creare un menu orizontale a schede come quello di html.it.

[salvox150]

Questo bellisimo sito spiega come realizzarli con il solo ausilio dei CSS (senza script)

http://www.alistapart.com/articles/slidingdoors/

Io li ho usati e sono davvero belli e personalizzabili,

quelli di questo sito fatto da me sono derivati da quelli dati:

http://www.giuseppequaro.com/

[agis]

Ok
Molte grazie..
ora prova a fare delle modifiche...

[agis]

scusami se voglio visualizzare qualcosa o una pagina quando clicco su un link del menu come devo fare..
ho provato così:

<div id="header">
<ul>
<li id="current">Zona Rossa[*]Zona Gialla[*]Zona Verde[/list]
</div>


<a name="rosso" id="rosso"><p style="margin:0; padding:1em; clear:both; font-family: verdana; font-size: 80%;">Zona Rossa</p></a>
<a name="giallo" id="giallo"><p style="margin:0; padding:1em; clear:both; font-family: verdana; font-size: 80%;">Zona Gialla</p></a>
<a name="verde" id="verde"><p style="margin:0; padding:1em; clear:both; font-family: verdana; font-size: 80%;">Zona Verde</p></a>

ma vi visualizza Zona Rossa, Zona Gialla, Zona Verde.. sempre nel primo menu..
devo aggiungere qualche altro tag??

[salvox150]

Non so se ho ben capito la tua domanda...

Se vuoi visualizzare all'inetrno della stessa pagina voci diverse cambaindo il menù attivo al momento devi usare javascript ed agire sull'ID.

Se vuoi aprire nuove pagine, basta copiare il menù nella nuova pagina e cambiare posizione all'ID "current" cioè:

Pagina1:

<div id="header">
<ul>
<li id="current">Pagina1[*]Pagina2[*]Pagina3[/list]
</div>

Pagina2:

<div id="header">
<ul>[*]Pagina1
<li id="current">Pagina2[*]Pagina3[/list]
</div>

e così via dicendo...

[agis]

Si vorrei visualizzare per ogni voce del menu (per voce per esempio) una tabella differente...

e come posso andare a modificare in javascript l'id?

non è che mi potresti fare un piccolo esempio..

[salvox150]

Ti ho buttato giù un esempio, non l'ho provato quindi possibilmente sarà pieno di errori specialmente con i caratteri di escape (javascript rompe con " e ' ...)

Inoltre manca nella funzione il vero e proprio collegamento, cioè ciò che tu vuoi aprire.
L'esempio serve in linea di massima ad aggiornare l'aspetto dei menù.

Prendila con le pinze (il codice si può migliorare molto) e considera che se ti serve approfondire ti conviene spostarti sulla sezione javascript.

<div id="header">
<ul>
<div id="menu1"><li id="current">Pagina1</div>
<div id="menu2">[*]Pagina2</div>
<div id="menu3">[*]Pagina3</div>[/list]
</div>

function agg_menu(id)
{
jmenu1=document.getElementById('menu1');
jmenu2=document.getElementById('menu2');
jmenu3=document.getElementById('menu3');

if (id=="menu1")
{
jmenu1.innerHTML='';
jmenu1.innerHTML="<li id=\"current\"><a href=\"javascript:agg_menu('menu1')\">Pagina1</a>"
jmenu2.innerHTML='';
jmenu2.innerHTML="[*]<a href=\"javascript:agg_menu('menu2')\">Pagina2</a>"
jmenu3.innerHTML='';
jmenu3.innerHTML="[*]<a href=\"javascript:agg_menu('menu3')\">Pagina3</a>"
}
else if (id=="menu2")
{
jmenu1.innerHTML='';
jmenu1.innerHTML="[*]<a href=\"javascript:agg_menu('menu1')\">Pagina1</a>"
jmenu2.innerHTML='';
jmenu2.innerHTML="<li id=\"current\"><a href=\"javascript:agg_menu('menu2')\">Pagina2</a>"
jmenu3.innerHTML='';
jmenu3.innerHTML="[*]<a href=\"javascript:agg_menu('menu3')\">Pagina3</a>"
}
else if (id=="menu2")
{
jmenu1.innerHTML='';
jmenu1.innerHTML="[*]<a href=\"javascript:agg_menu('menu1')\">Pagina1</a>"
jmenu2.innerHTML='';
jmenu2.innerHTML="[*]<a href=\"javascript:agg_menu('menu2')\">Pagina2</a>"
jmenu3.innerHTML='';
jmenu3.innerHTML="<li id=\"current\"><a href=\"javascript:agg_menu('menu3')\">Pagina3</a>"
}
}

Se vuoi dare un'occhiata in un sito ho usato un metodo simile, anche se con scopo differente:
www.dbers.it: guarda come cambiano le immagini delle isole nella home e se vuoi scaricati i sorgenti.

[agis]

Ho provato....
più o meno funziona solo che mi va a inserire sopra al menu un altra copia del menu, e si vedono due menu uno sovrapposto all'altro...

praticamente io vorrei che se clicco su pagina2 mi visualizzasse sotto il menu, (per esempio una tabella)... e cosi se clicco su pagina2..

[salvox150]

ti ho caricato un esempio a questo indirizzo:

http://xoomer.alice.it/salvatore.ted...empio_java.zip

è una mia area free che uso per testare siti e scambiare file.

Ho usato javascript sull'esempio scaricato dal sito che ti avevo proposto inizialmente.

Se ti va bene l'idea usa pure il codice, ma ti ripeto, la questione è propriamente javascript, non sei nella giusta sezione, finiranno per spostarti.

[agis]

Grazie proverò..