mostra nascondi più div

[bakunin]

Ciao ragazzi.
Ho questo codice che mi mostra e nasconde i div:

<script type="text/javascript">
function toggleDisplay(strId) {
document.getElementById(strId).style.display = document.getElementById(strId).style.display == 'block' ? 'none' : 'block';
}
</script>

nella pagina faccio comparire e nascondere con un click capito1 (immagine) e capitoloo 2 (testo)

<p style="cursor: pointer;" onclick="toggleDisplay('capitolo1'); toggleDisplay('capitolo2')" >uno</p>


Il problema è che cliccando su un altro link, mi compaiono altre immagini e testo senza far sparire gli altri.

Come posso fare a far sparire gli altri div e facendo apparire quelli che mi servono?

[bakunin]

stamattina cercherò qualcosa. Purtropppo sono consapevole di non essere capace, ma ci provo.
Ma penso sia semplice, dire ad un pulsante che prima di attivare i propri div, spegnere gli altri.

Buona giornata.

[bakunin]

Ho trovato uno script jqury.
Ma questo javascript (sopra) è così semplice.
Mi basterebbe saere solo come nascondere i div visibili con un click su un altro link.
:-(

[bakunin]

Lo script orinale sarebbe questo:

http://www.graficicreativi.com/gesti...un-titolo.html

[Vindav]

ecco un esempio:

<div id="capitolo1" style="display:none">capitolo1</div>
<div id="capitolo2" style="display:none">capitolo2</div>
<div id="capitolo3" style="display:none">capitolo3</div>
<div id="capitolo4" style="display:none">capitolo4</div>

<p style="cursor: pointer;" onclick="toggleDisplay('capitolo1');" >uno</p>
<p style="cursor: pointer;" onclick="toggleDisplay('capitolo2');" >due</p>
<p style="cursor: pointer;" onclick="toggleDisplay('capitolo3');" >tre</p>
<p style="cursor: pointer;" onclick="toggleDisplay('capitolo4');" >quattro</p>

function toggleDisplay(strId) {
document.getElementById(strId).style.display = document.getElementById(strId).style.display == 'block' ? 'none' : 'block';
var listDiv = document.getElementsByTagName("div");
for(i=0;i<listDiv.length;i++){
	if(listDiv[i].id != strId && listDiv[i].id.indexOf("capitolo") != -1) listDiv[i].style.display = "none";
}
}

Se vuoi far rendere visibili piu div alla volta basta passare alla funzione toggleDisplay piu parametri...

[bakunin]

Quindi se con un solo click voglio far comparire capitolo1 e capitolo2 devo fare così?

<div id="capitolo1" style="display:none">capitolo1</div>
<div id="capitolo2" style="display:none">capitolo2</div>

<p style="cursor: pointer;" onclick="toggleDisplay('capitolo1');toggleDisplay('capitolo2');">uno</p>

e grazie.

[Vindav]

<div id="capitolo1" style="display:none">capitolo1</div>
<div id="capitolo2" style="display:none">capitolo2</div>
<div id="capitolo3" style="display:none">capitolo3</div>
<div id="capitolo4" style="display:none">capitolo4</div>

<p style="cursor: pointer;" onclick="toggleDisplay('capitolo1','capitolo2');" >uno</p>
<p style="cursor: pointer;" onclick="toggleDisplay('capitolo3','capitolo4');" >due</p>

function toggleDisplay(strId1,strId2) {
document.getElementById(strId1).style.display = document.getElementById(strId1).style.display == 'block' ? 'none' : 'block';
document.getElementById(strId2).style.display = document.getElementById(strId2).style.display == 'block' ? 'none' : 'block';
var listDiv = document.getElementsByTagName("div");
for(i=0;i<listDiv.length;i++){
	if(listDiv[i].id != strId1 && listDiv[i].id != strId2 && listDiv[i].id.indexOf("capitolo") != -1) listDiv[i].style.display = "none";
}
}

[bakunin]

e se ti dicessi: infinitamente grazie?
:-)