Suche im Forum:
Suchen


« Vorheriges Thema anzeigen :: Nächstes Thema anzeigen »  
Autor Nachricht
Beitrag28.06.2014 um 17:53 (UTC)    
Titel: Mehrere Aufklapp-Texte

Hallo,

ich hab mal eine komplexe Frage.
Also, ich möchte so ein Aufklapp-Text haben. Das bekomme ich ja noch hin. Jedoch möchte ich direkt darunter noch eins, jedoch öffnet sich beim draufklicken auf das Zweite Menü das Erste.
Kann mir da jemand helfen?

Bei "Öffnen 1" Soll sich der "Inhalt 1" öffnen, bei "Öffnen 2" der "Inhalt 2".

Code:
<title></title>
<!-- Javascript -->       <script type="text/javascript">
         function showHideLayer(id){
            e = document.getElementById(id);
            if(e.style.display=="block"){
               e.style.display = "none";
            } else {
               e.style.display = "block";
            }
         }
      </script>            <!-- Link zum Anzeigen/Verstecken -->
        <a href="alternativerLink" onclick="showHideLayer('meinLayer');return(false)">
Öffnen 1
        </a>
<div id="meinLayer" style="display:none;">
<br>
Ihnalt 1
</div>
<br>
<title></title>
<!-- Javascript -->       <script type="text/javascript">
         function showHideLayer(id){
            e = document.getElementById(id);
            if(e.style.display=="block"){
               e.style.display = "none";
            } else {
               e.style.display = "block";
            }
         }
      </script>            <!-- Link zum Anzeigen/Verstecken -->
        <a href="alternativerLink" onclick="showHideLayer('meinLayer');return(false)">
 Öffnen 2
        </a>

<div id="meinLayer" style="display:none;">

<br>
Inhalt 2

</div>


Zuletzt bearbeitet von busbild am 28.06.2014, 18:54, insgesamt einmal bearbeitet
Beitrag30.06.2014 um 16:13 (UTC)    
Titel:

Ich habe deinen Code mal ein wenig verändert und optimiert.

Code:
<!-- Javascript -->
<script type="text/javascript">
function showHideLayer(id) {
  e = document.getElementById(id);
  if(e.style.display == "block") {
      e.style.display = "none";
  } else {
    e.style.display = "block";
  }
}
</script>

<!-- Link zum Anzeigen/Verstecken -->
<a href="alternativerLink" onclick="showHideLayer('meinLayer');return(false)">Öffnen 1</a>

<!-- Angezeigte/Versteckte Box -->
<div id="meinLayer" style="display:none;">
  Inhalt 1
</div>

<br>

<!-- Link zum Anzeigen/Verstecken -->
<a href="alternativerLink" onclick="showHideLayer('meinLayer2');return(false)">Öffnen 2</a>

<!-- Angezeigte/Versteckte Box -->
<div id="meinLayer2" style="display:none;">
  Inhalt 2
</div>


Was ich geändert habe?
- Es reicht, wenn man eine Javascript Funktion 1x pro Seite definiert, somit habe ich die 2te Funktion entfernt.
- Der 2te Link und die 2te Box sind leicht geändert. (Box 1: meinLayer, Box 2: meinLayer2)

Warum es nicht funktioniert hat:
Du hast mit deinem 2ten Link die erste Box angesprochen, weil die ID in deinem onclick-Attribut "meinLayer" ist.
Da man aber eigentlich eine ID in HTML nur 1x pro Seite verwendet werden darf, nimmt sich Javascript einfach das erste Element.

Ich hoffe du kannst damit etwas anfangen.

MfG Dennis
______________

Meine Seiten sind aktuell aufgrund von zeitlichen Gründen pausiert.
Beitrag30.06.2014 um 16:34 (UTC)    
Titel:

Gut, jetzt bin ich etwas schlauer. Vielen Dank dafür Smile

busbild
Beiträge der letzten Zeit anzeigen:   


Powered by phpBB © 2001, 2005 phpBB Group
Deutsche Übersetzung von phpBB.de