Aiuto Funzione Show Hide Javascript

[Raylight]

Salve a tutti dopo innumerevoli miei tentativi nel cercare di risolvere il problema del mio show hide mi sono arreso e ho deciso di chiedere qui aiuto a qualche bravo programmatore in grado di aiutarmi.
Il code attualmente e funzionante e lo sto utilizzando in alcune sezione. Io vorrei però applicare la seguente funzione:

- cliccando su un'immagine mi appaia il suo contenuto al di sotto pero cliccando poi un'altra immagine, prima di aprire il contenuto della nuova immagine voglio che chiuda quella gia aperta!

Attualmente col code che utilizzo, tutti i contenuti delle immagini vengono sovrapposte il che mi cause un bel problema. Il codice Javascript che utilizzo è il seguente:

<script language="javascript" type="text/javascript">
function showHide(shID) {
if (document.getElementById(shID)) {
if (document.getElementById(shID+'-show').style.display != 'block') {
document.getElementById(shID+'-show').style.display = 'none';
document.getElementById(shID+'-show').style.display = 'block';
document.getElementById(shID).style.display = 'block';
}
else {
document.getElementById(shID+'-show').style.display = 'inline';
document.getElementById(shID).style.display = 'none';

}
}
}
</script>





Mentre il codice utilizzato per le immagini e i div coi contenuti e questo:

<table border="0" cellpadding="3" cellspacing="0" width="700">
<tr>
<td>[img].../clan_uzumaki.png[/img]</td>

<td> [img]...clan_uchiha.png[/img] </td>
</table>

<div id="uzumaki" class="more" >



Il Clan Uzumaki era il principale clan del Villaggio. Vantava una remota parentela di sangue con il Clan Senju di Konoha, e questo fu alla base della secolare alleanza fra i paesi del...
</p>


Chiudi</p>
</div>


<div id="uchiha" class="more">



Il Clan Uchiha è uno dei clan del Villaggio della Foglia nella serie manga ed anime Naruto, del mangaka Masashi Kishimoto. Un tempo considerato il più potente clan del Villaggio della Foglia, l'unico...
</p>


Chiudi</p>
</div>



Spero possiate aiutarmi Grazie in anticipo!

[Vindav]

non sono sicuro di aver capito esattamente cosa devi fare... e il codice mi pare parecchio incasinato... cmq prova cosi:

<table border="0" cellpadding="3" cellspacing="0" width="700"> <tr> <td>[img].../clan_uzumaki.png[/img]</td> <td> [img]...clan_uchiha.png[/img] </td> </table> <div id="uzumaki" style="display:none;"> 

 Il Clan Uzumaki era il principale clan del Villaggio. Vantava una remota parentela di sangue con il Clan Senju di Konoha, e questo fu alla base della secolare alleanza fra i paesi del... </p> </div> <div id="uchiha" style="display:none;"> 

 Il Clan Uchiha è uno dei clan del Villaggio della Foglia nella serie manga ed anime Naruto, del mangaka Masashi Kishimoto. Un tempo considerato il più potente clan del Villaggio della Foglia, l'unico... </p> </div>

 <script type="text/javascript"> function showHide(shID,shID2) { if(shID.style.display == 'block') shID.style.display = 'none'; else shID.style.display = 'block'; shID2.style.display = 'none'; } </script>

[Raylight]

Grazie Mille il codice funziona, e esattamente come volevo! grazie ancora gentilissimo!

[Raylight]

Ah volevo chiedervi un'altra, se potreste mica modificare il Javascript in quanto le targhette che uso io non sono solo 2 ma 8.


<script type="text/javascript">
function showHide(shID,shID2)
{ if(shID.style.display == 'block')
shID.style.display = 'none';
else shID.style.display = 'block';
shID2.style.display = 'none'; }
</script>

Il codice che mi avete dato sopra va bene solo nel caso in cui io utilizzi solamente quelle 2 immagini coi contenuti, mentre a me servirebbe un codice che funzionasse anche per piu immagini. Attualmente nella sezione villaggi del mio sitoci sono 8 immagini quindi a tutte e 8 devo applicare questa funzione del show hide!

ho provato da solo ad aggiungere shID3, shID4 ecc ma niente mi blocca il funzionamento di tutte le altre!

[Vindav]

prova cosi:

<table border="0" cellpadding="3" cellspacing="0" width="700"> <tr> <td>[img].../clan_uzumaki.png[/img]</td> <td> [img]...clan_uchiha.png[/img] </td> <td> [img]...clan_uchiha.png[/img] </td> </table> <div id="inf1" style="display:none;"> 

 Il Clan Uzumaki era il principale clan del Villaggio. Vantava una remota parentela di sangue con il Clan Senju di Konoha, e questo fu alla base della secolare alleanza fra i paesi del... </p> </div> <div id="inf2" style="display:none;"> 

 Il Clan Uchiha è uno dei clan del Villaggio della Foglia nella serie manga ed anime Naruto, del mangaka Masashi Kishimoto. Un tempo considerato il più potente clan del Villaggio della Foglia, l'unico... </p> </div> <div id="inf3" style="display:none;"> 

 prova....... </p> </div>

<script type="text/javascript"> function showHide(shID) { if(shID.style.display == 'block') shID.style.display = 'none'; else shID.style.display = 'block'; i=1; while(true){ if(document.getElementById("inf"+i)){ if(document.getElementById("inf"+i) != shID) document.getElementById("inf"+i).style.display = 'none'; }else{ break; } i++; } } </script>

[Raylight]

Ok funziona lo finito di testare adesso.
Volevo chiedere se fosse possibile tenere quella stringa di codice che utilizzavo nel primo codice ovvero per far apparire il contenuto dentro un inline ovvero tra le due righe sopra e sotto:

document.getElementById(shID+'-show').style.display = 'inline';

[Vindav]

si puoi sostituire la proprietà block con inline o con inline-block

[Raylight]

Niente ho provato ma non funziona... se modifico il block con l'inline mi blocca la funzione hide una volta aperto il contenuto mentre mettendo entrambi i tag inline-block il tutto funziona normalmente pero senza l'inline!