Themabewertung:
  • 0 Bewertung(en) - 0 im Durchschnitt
  • 1
  • 2
  • 3
  • 4
  • 5
Accordion-Effekt anpassen
#1
Hallo zusammen,

nach längerer Zeit bin ich mal wieder hier um Euch um Rat zu bitten.

Zur Darstellung von gleichförmigen, listenartigen Inhalten möchte ich einen Accordion-Effekt nutzen.

Ich habe auch schon ein schönes Beispiel meinem Layout angepasst und es funktioniert soweit auch. Nur möchte ich, dass auf einen Klick auf die Textüberschrift der Text nicht nur ausgeklappt, sondern auf nochmaligen Klick auch wieder zugeklappt wird. Der Rest soll so funktionieren wie bisher.

Nachfolgend mal die Codeschnipsel.

HTML:
Code:
<div>
<div class="slides">
  <div>
   <div>
    <h3>Projekt 1</h3>
    <div class="content">
        Projektbeschreibung 1
    </div>
   </div>
  </div>
</div>
</div>

Javascript (wurde in das Page-Template von Typo3 eingebaut):
Code:
<script type="text/javascript">
  $("div.content").hide();
  $("div.content:first").hide();
  $("h3").bind("click", function() {
  if ( $(this).next().css("display") == 'none' ) {
  $("div.content").hide();
  $(this).next().slideDown(450);
    }
});
</script>

Ich hoffe ihr könnt mir hierbei weiterhelfen. Ich sage wie immer schon mal Danke.

Gruß Tino
Zitieren
#2
Versuchs mal so:

    JAVASCRIPT Programming
  1. <script type="text/javascript">
  2. $("div.content").hide();
  3. $("div.content:first").hide();
  4. $("h3").bind("click", function() {
  5. if ( $(this).next().css("display") == 'none' ) {
  6. $("div.content").hide();
  7. $(this).next().slideDown(450);
  8. } else if ( $(this).next().css("display") == 'block') {
  9. $(this).next().slideUp(450);
  10. }
  11. });
  12. </script>




by the way, wenn du schon jQuery nutzt, wieso nicht gleich die jQuery UI?

http://jqueryui.com/demos/accordion/#collapsible

dort gibt's auch gleich ne Option dafür Wink
MfG René
Systemadministrator, Webentwickler

pantanet.de - pantamedia.com - gosna.de

Wishlist
Zitieren
#3
Hallo,

guter Tipp. Danke schon mal.

Gruß Tino
Zitieren


Gehe zu:


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste