Ich habe 2 Tabs: Notizen und Aufgaben. Beim Seitenstart soll automatisch der Notizen-Tab geöffnet sein, der andere geschlossen.
Dazu habe ich jeweils 2 Bilder: an.png und aus.png. Bei den Notizen ist standartmäßig der Aus-Tab unsichtbar und bei den Aufgaben ist der An-Tab unsichtbar.
Beim Klick auf einen geschlossenen Tab (aus.png) soll sich derjenige öffnen, wobei sich der andere schließt.
In meinem Beispiel werden erstmal beide An-Tabs ausgeblendet und alle Aus-Tabs und das gebrauchte Tab eingeblendet (Funktion: tauschen()).
Jedoch werden bei mir nur alle Tabs "geschlossen", also die An-Tabs ausgeblendet.
Was mache ich denn falsch?
Danke!
Dazu habe ich jeweils 2 Bilder: an.png und aus.png. Bei den Notizen ist standartmäßig der Aus-Tab unsichtbar und bei den Aufgaben ist der An-Tab unsichtbar.
Beim Klick auf einen geschlossenen Tab (aus.png) soll sich derjenige öffnen, wobei sich der andere schließt.
In meinem Beispiel werden erstmal beide An-Tabs ausgeblendet und alle Aus-Tabs und das gebrauchte Tab eingeblendet (Funktion: tauschen()).
Jedoch werden bei mir nur alle Tabs "geschlossen", also die An-Tabs ausgeblendet.
Was mache ich denn falsch?
Danke!
HTML:
<div id="notizenAus" style="position:absolute; display:none; padding-top:100px; margin-left:100px;" onclick="tauschen(notizenAn)">
<img src="/images/aus.png" class="tab" /></div>
<div id="notizenAn" style="position:absolute; margin-top:100px; margin-left:100px;">
<img src="/images/an.png" class="tab" /></div>
<div style="position:absolute; margin-top:100px; margin-left:100px;">
Notizen</div>
<div id="aufgabenAn" style="position:absolute; display:none; margin-top:100px; margin-left:200px;">
<img src="/images/an.png" class="tab" /></div>
<div id="aufgabenAus" style="position:absolute; padding-top:100px; margin-left:200px;" onclick="tauschen(aufgabenAn)">
<img src="/images/aus.png" class="tab" /></div>
<div style="position:absolute; margin-top:100px; margin-left:200px;">
Aufgaben</div>
Code:
function tauschen(tab){
document.getElementById("aufgabenAn").style.display="none";
document.getElementById("notizenAn").style.display="none";
document.getElementById("notizenAus").style.display="";
document.getElementById("aufgabenAus").style.display="";
document.getElementById(tab).style.display="";}