Spoiler mit HTML machen?

Registriere dich, um den vollen Funktionsumfang des Forums ausnutzen zu können.
  • Du brauchst zwei Elemente:

    Einen (sichtbaren) Button, mit dem man den Spoiler auf und zuklappen kann und den Spoiler an für sich.

    Den Spoiler an für sich kannst du mittels CSS mit display: none; verstecken.

    Beim Button kannst du mittels jQuery auf ein Click-Event listenen. Dort kannst du dann einfach mittels der Methoden closest und toggle den Spoiler anzeigen und ausblenden.


    Entschuldige diese kurze Antwort, aber am Handy kann man nicht viel schreiben, vor Allem keinen Code.

  • Um das ganze etwas dynamisch zu machen empfehle ich jQuery.


    Zum Beispiel ein Link: <a class="spoiler-trigger" href="#spoiler1">Anzeigen</a>


    Dann noch einen kleinen Spoiler:


    Code
    1. <div class="spoiler" id="spoiler1">
    2.     Content
    3. </div>


    In JavaScript kannst du mittels jQuery auf Klicke "lauschen". Du frägst dann am besten ab ob es ein Link ist und die Klasse spoiler-trigger ist.

    Dann findest du heraus was der Inhalt des href´s ist, könnte glaube so gehen: $(this).attr("href"). Damit kannst du dir dann ein Element holen und dieses sichtbar machen, was ungefähr so klappen könnte: $($(this).attr("href")).css("display", "block");. Dann natürlich noch den Link Text ändern was einfach mit .text() geht. Dann natürlich noch umgedreht machen ^^