DIV Tags ausblenden.

[andralin]

Hallo Leute,

ich habe mehrere Textinhalte die bei einem Klick auf einen Link ausgetauscht werden soll.

Gedankenspiel: Beim KLICK werden alle Layer ausgeblendet, nur der übergebene wird wieder eingeblendet.

der Aufruf:

<p><a href="javascript:;" onclick="ShowLayer('apDiv4')">Foto-Ausrüstung</a></p>

die Funktion:

function ShowLayer(layer)
{
	document.getElementById("apDiv1").style.visibility=hidden;	
	document.getElementById("apDiv2").style.visibility=hidden;	
	document.getElementById("apDiv3").style.visibility=hidden;	
	document.getElementById("apDiv4").style.visibility=hidden;	
	document.getElementById(layer).style.visibility=show;	
}

Ich programmiere eigentlich in C#, VB und PHP, JS habe ich leider sträflich vernachlässigt. Aber vielleicht kann mir einer von Euch helfen.

Grüße, Andralin

 

[hela]

Hallo,

probier es mal so:

<p><a href="#" onclick="ShowLayer('apDiv4');return false;">Foto-Ausrüstung</a></p>

function ShowLayer(layer)
{
    document.getElementById("apDiv1").style.visibility="hidden";
//    ...
//    usw. usf.
//    ...
    document.getElementById(layer).style.visibility="visible";
}

 

[philomatique]

Moin Jungs,

ich hab auch eine Lösung. Die ist ganz dynamisch, unabhängig davon, wieviele apDiv[id] es gibt und muss nie nachbearbeitet werden, falls sich die Anzahl mal ändert:

<script type="text/javascript">
// <![CDATA[
	
	function ShowLayer(layer) {
	
		i = 1;
		while (e = document.getElementById("apDiv" + i)) {
			
			if (i != layer) e.style.visibility = 'hidden'; else e.style.visibility = 'visible';
			++i;
	
		}

	}

	
// ]]>
</script>

<p><a href="javascript:void(0);" onclick="ShowLayer(4);">Foto-Ausrüstung</a></p>

Hoffe, es hilft weiter.

Viele Grüße
Phil

 

[andralin]

Hallo,

probier es mal so:

<p><a href="#" onclick="ShowLayer('apDiv4');return false;">Foto-Ausrüstung</a></p>

function ShowLayer(layer)
{
    document.getElementById("apDiv1").style.visibility="hidden";
//    ...
//    usw. usf.
//    ...
    document.getElementById(layer).style.visibility="visible";
}

Danke für die schnelle Antwort, testen kann ich das erst heute Abend zu Hause.
Ist das auf allen Browsern kompatibel?

Moin Jungs,

ich hab auch eine Lösung. Die ist ganz dynamisch, unabhängig davon, wieviele apDiv[id] es gibt und muss nie nachbearbeitet werden, falls sich die Anzahl mal ändert:

<script type="text/javascript">
// <![CDATA[
	
	function ShowLayer(layer) {
	
		i = 1;
		while (e = document.getElementById("apDiv" + i)) {
			
			if (i != layer) e.style.visibility = 'hidden'; else e.style.visibility = 'visible';
			++i;
	
		}

	}

	
// ]]>
</script>

<p><a href="javascript:void(0);" onclick="ShowLayer(4);">Foto-Ausrüstung</a></p>

Hoffe, es hilft weiter.

Viele Grüße
Phil

Danke für die schnelle Antwort, auch das kann ich erst heute Abend zu Hause testen. So eine dynamische Lösung wäre schon das gewesen was ich letztendlich draus machen wollte. Klasse. Hoffe das läuft auch in allen Brwosern.

 

[hela]

... Ist das auf allen Browsern kompatibel?

Das funktioniert ab IE5 und ab Netscape6. Wenn du noch IE4 und Netscape4 bedienen willst, dann müsstest du das über document.all[id].style.visibility='visible'||'hidden' bzw. document.layers[id].visibility='show'||'hide' erledigen.