Akkordeon toggler

Hallo,
ich möchte das moo_default Template um ein "active" für das jeweils aktive Element des Akkordeons erweitern.

Ich habe dazu bereits folgende Tips gefunden (http://www.typolight.glen-langer.de/...eon_Modul.html), jedoch wird hier das Template moo_foreground angepasst.

Schöne Grüße
key

HI

das alles funktioniert mit allen moo_*.tpl-Templates. Was genau willst du denn erreichen, und was hast du bereits getan?

Sebastian

Hallo,
wenn ein Element des Akkordeons "ausgefahren" wird, soll das Element die Klasse 'active' bekommen, damit ich je nachdem ob das Element Aktiv oder nicht ist ein Plus bzw. Minus anzeigen kann.

Dazu habe ich bis jetzt folgendes versucht:

Code:

---

<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready', function()
{
        new Accordion($$('div.toggler'), $$('div.accordion'),
        {
                display: false,
                alwaysHide: true,
                opacity: false,

                onActive: function(toggler, i)
                {
                        toggler.getFirst() ? toggler.getFirst().toggler.addClass('active') : toggler.addClass('active');
                },

                onBackground: function(toggler, i)
                {
                        toggler.getFirst() ? toggler.getFirst().toggler.removeClass('active') : toggler.removeClass('active');
                }
        });
});
//--><!]]>
</script>

---

Leider nur mit dem Erfolg, dass alle Elemente ausgefahren sind, und keine Klasse active hinzugekommen ist.

Grüße
key

Hallo,

probier' mal das hier:

HTML-Code:

---

<script type="text/javascript">
<!--//--><![CDATA[//><!--
window.addEvent('domready', function()
{
        this.accordion = new Accordion($$('div.toggler'), $$('div.accordion'),
        {
                display: false,
                alwaysHide: true,
                opacity: false,

                onActive: function(toggler, i)
                {
                        toggler.getFirst() ? toggler.getFirst().addClass('active') : toggler.addClass('active');
                        toggler.getFirst() ? toggler.getFirst().removeClass('inactive') : toggler.removeClass('inactive');
                },

                onBackground: function(toggler, i)
                {
                        toggler.getFirst() ? toggler.getFirst().removeClass('active') : toggler.removeClass('active');
                        toggler.getFirst() ? toggler.getFirst().addClass('inactive') : toggler.addClass('inactive');
                }
        });
});
//--><!]]>
</script>

---

Vielen Dank, das hat funktioniert.

Grüße
key

Hallo,
eine Frage habe ich dann doch noch. Ist es möglich, dass beim Laden der Seite direkt das erste Element geöffnet wird?

Grüße
key

Hallo key,
im Seitenlayout > Experteneinstellungen > Mootools-Template > und hier moo_devault auswählen.

Viele Grüße

Hallo,
das wäre sicherlich möglich, allerdings hätte ich dann die Markierung des ausgefahrenen Elements als active nichtmehr. Vielleicht gibt es eine Möglichkeit das in die Idee von "xchs " zu integrieren?

Grüße
key

Edit: vielleicht könnte man es auch noch hinbekommen, dass das active bzw. inactive nicht eine Klasse des Textes im Toggler ist, sondern eine Klasse des Togglers selber.

Hallo,

hast Du schon probiert, anstelle von "display: false" hier ein "true" zu setzen?

Hallo,
ja das habe ich schon probiert. Hierbei wird fast alles richtig angezeigt, allerdings öffnet er beim Laden der Seite das zweite Element und nicht das Erste des Akkordions.

Grüße
key

O key,

dann machen wir's anders: Lösch bitte mal die beiden Zeilen

HTML-Code:

---

display: false,
alwaysHide: true,

---

raus und versuchs nochmal!

vielen Dank jetzt klappts :-)

das werde ich mir jetzt aber auch irgendwo gut abspeichern :-)

Na dann, viel Spaß noch mit TYPOlight!

Nur so als Anmerkung:

Wenn ihr ein bestimmtes Element in eurem Accordion aufklappen wollt und eh in der moo_accordion.tpl rumschreibt:

Code:

---

display: 2,

---

öffnet das 3. Element. Um das erste Element zu öffnen wäre es dann display: 0.
display: false Ist eigentlich nicht zulässig, oder? Denn display ist laut mootools doc als integer definiert. Obwohl javascript ist ja nicht so streng typisiert.

Zitat:

---

Zitat von mikado

display: false Ist eigentlich nicht zulässig, oder? Denn display ist laut mootools doc als integer definiert. Obwohl javascript ist ja nicht so streng typisiert.

---

Ok, dann müsste man für "display: false" wohl "display: -1" verwenden oder?

Jo, wenn man es korrekt nimmt, ist "display: -1" die bessere Wahl.

Zitat:

---

Zitat von mikado

Jo, wenn man es korrekt nimmt, ist "display: -1" die bessere Wahl.

---

Und korrekt wollen wir ja sein... von daher werd ich mal mein Template entsprechend anpassen.

Vielen Dank für den Hinweis.

Wenn ich das richtig verstanden habe, dann soll doch das oben genannte javascript, das ich ins moo_accordion-Template schreibe, dem aktiven (also aufgeklappten) Element des Akkordions eine Klasse .active anhängen ?
Passiert bei mir aber nicht, oder hab ich da grundsätzlich was falsch verstanden?

Öhhmhöm ... :p komischerweise funktionieren bei mir die Sachen immer erst dann, wenn ich dumm im Forum nachgefragt habe ... es geht jedenfalls alles - genau wie oben beschrieben!! Danke.