Expander-Klapptext

Nemera

Moin zusammen

Bevor ich meine Frage stelle, ich habe natürlich die SuFu benutzt und auch einiges zu Spoiler und Klapptext gefunden, aber letztlich nicht das was ich suche. Es geht mir um folgendes, ich habe den Spoiler BB Code eingebaut mit diessem Ersetzer von mywbb.

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:

<div class="spoiler">
<div class="spoilerkopf">
    <input  type="button" value="Zeigen" style="width:65px; font-size:10px; margin:0px; padding:0px;" onclick="if 

(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') 
            { 
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
                this.innerText = ''; 
                this.value = 'Verstecken'; 
            } 
            else 
            {
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
                this.innerText = ''; 
                this.value = 'Zeigen'; 
            }"/></div>

<div>
    <div style="display: none;" class="spoilerlook">
        {param1}
    </div>
</div>
</div>

Das funktioniert auch keine Frage, aber ich weiß nicht genau wie ich den Code abändern muss, wenn ich anstatt der Button "Zeigen und "Verstecken" die aus den Kategorie gewohnten + und - Zeichen anzeigen lassen will.

Es sollte also z.b so aussehen, wenn ich zu einem bestimmten Thema, mal als Beispiel "Flora" einen Text schreibe, sollte bis auf den Klick auf das Pluzeichen nur Flora sichtbar sein.

+ Flora (per Klick dann der Text]
- Flora [per KLick Text wieder ausblenden]

Ich hoffe ich konnte mich verständlich machen und es klingt nicht zu wirr.

LG Nema

mkkcs

vielleicht einfach Zeigen = + und Verstecken = - setzen ???

janolaf

hab ich mir grad so gedacht,
einfach so machen...

code:

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:

<div class="spoiler">
<div class="spoilerkopf">
    <input  type="button" value="+" style="width:20px; font-size:10px; margin:0px; padding:0px;" onclick="if 

(this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') 
            { 
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';
                this.innerText = ''; 
                this.value = '-';
            } 
            else 
            {
                this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none';
                this.innerText = ''; 
                this.value = '+'; 
            }"/></div>

<div>
    <div style="display: none;" class="spoilerlook">
        {param1}
    </div>
</div>
</div>

aber dann ist's immernoch dieser komische input-button , statt der grafik vom style.
wobei ich leider nicht weiss , wie man dort jetzt ne grafik einfügt.

no-skill

Das ist dir entgangen oder auch nicht das ware ?

Expander BBCode
http://community.woltlab.com/db/index.ph...t&projectID=383

[IMG]http://img5.imagebanana.com/img/zyha453s/thumb/Zwischenablage01.png[/I
MG]

[EDIT] Autsch mein fehler 2.3 nicht 3.x ^^ SORRÜÜÜÜÜ

Nemera

Zitat:

Original von no-skill
Das ist dir entgangen oder auch nicht das ware ?

Expander BBCode
http://community.woltlab.com/db/index.ph...t&projectID=383

[IMG]http://img5.imagebanana.com/img/zyha453s/thumb/Zwischenablage01.png[/I
MG]

[EDIT] Autsch mein fehler 2.3 nicht 3.x ^^ SORRÜÜÜÜÜ

Jaab, aber das ist genau das was ich suche nur halt fürs 2.3.6. Augen rollen

Danke, schon mal für eure Antworten auch wenn leider bisher nichts passendes dabei war.

mkkcs

Zitat:

Original von janolaf
...
aber dann ist's immernoch dieser komische input-button , statt der grafik vom style.
wobei ich leider nicht weiss , wie man dort jetzt ne grafik einfügt.

dann mußte halt den INPUT-Button durch eine Grafik austauschen ....

hier mal ein paar Beispiele -> http://www.mywbb.info/board/thread.php?p...2398#post912398

wie sowas ausschauen kann !

Nemera

Das hatte ich auch schon gesehen, aber mit keinem der Beispiele erreiche ich das Ergebnis was ich haben möchte.

Daher habe ich gefragt, weil ich den Code nicht einfach anpassen kann, ich verstehe nichts von diesem PHP Sachen die zwischen dem HTML Code stehen. Ich habe schon ein wenig herum probiert, führte aber meist dazu das es entweder gar nicht mehr ging oder nur halb funktionierte.

Für mein WBB 3 kenne und benutze ich das Expander BB Code Plugin, aber so etwas, nicht einmal anähernd so etwas habe ich weder in deinen Beispielen noch sonst irgendwo finden können. Versagt

Ich denke mir einfach mal das man es auch für das WBB 2.3.6 hinbekommen müsste, zumindest so ähnlich, doch meine Kentnisse reichen dazu leider nicht aus. traurig

Das ist der Code den ich derzeit benutze.

code:

1:

<div style="margin:0px; margin-top:0px"> <div class="smallfont" style="margin-bottom:0px"><b>{param1}</b>   <input type="button" value="Show" style="width:45px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }"> </div> <div class="alt2" style="margin: 0px; padding: 0px; border: 0px inset;"> <div style="display: none;">{param2}</div></div></div>

Damit es eben mit

code:
1:	[spoiler=Spoilertitel]Inhalt[/spoiler]

funktioniert.
Soweit funktioniert es auch, nun wollte ich das vor dem, von mir je eingegeben Spoilertitel, das Pluszeichen.gif erscheint, wenn es noch nicht aufgeklappt ist, wenn es aufgeklappt ist sollte neben Spoilertitel das Minuszeichen.gif erscheinen.

Ich vermute mal das es nicht möglich ist, das der Spoilertitel zum anklickbaren Link wird, daher sollten das Plus und das Minuszeichen selbiges übernehmen. Und genau daran scheitert es bei allen Beispielen, es sind immer nur Button oder eben Texte wie zeigen und verstecken.

mkkcs

Zitat:

Original von Nemera
Das hatte ich auch schon gesehen, aber mit keinem der Beispiele erreiche ich das Ergebnis was ich haben möchte.

Daher habe ich gefragt, weil ich den Code nicht einfach anpassen kann, ich verstehe nichts von diesem PHP Sachen die zwischen dem HTML Code stehen. Ich habe schon ein wenig herum probiert, führte aber meist dazu das es entweder gar nicht mehr ging oder nur halb funktionierte.

Für mein WBB 3 kenne und benutze ich das Expander BB Code Plugin, aber so etwas, nicht einmal anähernd so etwas habe ich weder in deinen Beispielen noch sonst irgendwo finden können. Versagt

Ich denke mir einfach mal das man es auch für das WBB 2.3.6 hinbekommen müsste, zumindest so ähnlich, doch meine Kentnisse reichen dazu leider nicht aus. traurig

Das ist der Code den ich derzeit benutze.

code:

1:

<div style="margin:0px; margin-top:0px"> <div class="smallfont" style="margin-bottom:0px"><b>{param1}</b>   <input type="button" value="Show" style="width:45px;font-size:10px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }"> </div> <div class="alt2" style="margin: 0px; padding: 0px; border: 0px inset;"> <div style="display: none;">{param2}</div></div></div>

Damit es eben mit

code:
1:	[spoiler=Spoilertitel]Inhalt[/spoiler]

doch ist möglich, es gibt fast nichts was nicht funktioniert ....
-> http://testlite.grafix-board.de/thread.php?postid=64#post64

Nemera

Zitat:

Original von mkkcs
doch ist möglich, es gibt fast nichts was nicht funktioniert ....
-> http://testlite.grafix-board.de/thread.php?postid=64#post64

wenn, man weiß wie, mag das stimmen Freude

Und wie hast du es nun bewerkstelligt? Deine Beispiele sind so wie ich mir das ganze vorgestellt habe, verrätst du mir bitte auch noch den Code dazu? großes Grinsen

LG Nema

mkkcs

na wollen wir mal nicht so sein ...

hier ein SQL

code:

1:
2:
3:
4:
5:

INSERT INTO `bb1_bbcodes` (`bbcodeid`, `bbcodetag`, `bbcodereplacement`, `bbcodeexample`, `bbcodeexplanation`, `params`, `multiuse`) VALUES
(NULL, 'spoiler', '<div id="spoiler" class="spoiler">\r\n<div id="spoilerkopf" class="spoilerkopf">\r\n<span onClick="if (this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display != '''') \r\n{  this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display = ''''; this.innerHTML = ''<img src=\\''images/minus.gif\\'' border=\\''0\\'' alt=\\''\\'' onClick=\\''return false;\\'' /> <b>\\2</b>''; } \r\nelse \r\n{ this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display = ''none''; this.innerHTML = ''<img src=\\''images/plus.gif\\'' border=\\''0\\'' alt=\\''\\'' onClick=\\''return false;\\'' /> <b>\\2</b>''; }" />\r\n<img src="images/plus.gif" border="0" alt="" onClick="return false;" /> <b>\\2</b>\r\n</span>\r\n</div>\r\n<div>\r\n<div style="display: none;" class="spoilerlook">\r\n\\3\r\n</div>\r\n</div>\r\n</div>\r\n', '[SPOILER]Antwort auf die Frage[/SPOILER]', 'Der in den Klammern eingegebene Text wird "versteckt" und kann nur gelesen werden, wenn der User den Text "Zeigen" lässt. Geeignet für Quiz-Fragen oder Threads die Dinge verraten, die vlt. nicht von allen gesehen werden wollen (Filmausgang, Antwort auf eine Frage, etc.).', 2, 10),
(NULL, 'spoiler', '<div id="spoiler" class="spoiler">\r\n<div id="spoilerkopf" class="spoilerkopf">\r\n<span onClick="if (this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display != '''') \r\n{  this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display = ''''; this.innerHTML = ''<img src=\\''images/minus.gif\\'' border=\\''0\\'' alt=\\''\\'' onClick=\\''return false;\\'' /> <b><- Klick mich zum zeigen</b>''; } \r\nelse \r\n{ this.parentNode.parentNode.getElementsByTagName(''div'')[1].getElementsByTagName(''div'')[0].style.display = ''none''; this.innerHTML = ''<img src=\\''images/plus.gif\\'' border=\\''0\\'' alt=\\''\\'' onClick=\\''return false;\\'' /> <b><- Klick mich zum zeigen</b>''; }" />\r\n<img src="images/plus.gif" border="0" alt="" onClick="return false;" /> <b><- Klick mich zum zeigen</b>\r\n</span>\r\n</div>\r\n<div>\r\n<div style="display: none;" class="spoilerlook">\r\n\\1\r\n</div>\r\n</div>\r\n</div>\r\n', '[SPOILER]Antwort auf die Frage[/SPOILER]', 'Der in den Klammern eingegebene Text wird "versteckt" und kann nur gelesen werden, wenn der User den Text "Zeigen" lässt. Geeignet für Quiz-Fragen oder Threads die Dinge verraten, die vlt. nicht von allen gesehen werden wollen (Filmausgang, Antwort auf eine Frage, etc.).', 1, 10);

bb1_bbcodes ggf. auf die eigene Boardnummer anpassen, und evtl. kannst Du auch den Inhalt bbcodetag = 'spoiler' auf Dein eigenen Aufruf anpassen, so wie Du es haben möchtest.

Nemera

Ahhhh langsam Versagt

erst einmal Danke für deine Hilfe, aber ich bin leider nicht gearde ein Profi in diesen Dingen.

Ich habe jetzt deinen Code als SQL Abfrage gemacht, ich hoffe, denke das war gemeint. Jetzt weiß ich nicht was und ob ich noch etwas an den BB Code selber einstellen muss, hatte ja unter BB Code zwei neue erstellt einmal den normalen spoiler und einmal spoiler=titel.

Wäre lieb wenn du mir da noch sagen könntest was ich da jetzt genau tun muss, tut mir leid wenn ich mich ein bissel dumm anstelle, aber das ist einfach Neuland für mich. Augen rollen

mkkcs

das ist ein SQL der für beide BBCodes geht !
d.h. Du kannst Ihn einmal als

[spoiler]blabla[/spoiler]
-------------------------------------------------
sieht dann so aus
+ <- Klick mich zum zeigen
-------------------------------------------------
- <- Klick mich zum zeigen
blabla
-------------------------------------------------
oder auch
[spoiler=spoilertitel]blubbblubb[/spoiler]
-------------------------------------------------
sieht dann so aus
+ spoilertitel:
-------------------------------------------------
- spoilertitel:
blubbblubb
-------------------------------------------------
ansprechen ...

also wenn Du nur diesen haben willst, dann lösch einfach die beiden Einträge in der bbcode-Tabelle, und führe den SQL in Deinem PHPmyAdmin aus, und Du hast diese Funktion dann so wie Du es haben wolltest.

wenn Du dagegen in expander nennen möchtest, dann mußt Du ihn dahin anpassen, das Du ihn erst erszeugst, und dann in den Neuerzeugten Einträgen den bbcodetag - expander nennst.

Nemera

Also ich habe es nun dank deiner geduldigen Hilfe hinbekommen

Beide Spoiler funktionieren mit einer kleinen Ausnahme, es wird weder ein Plus- noch ein Minuszeichen angezeigt. Ich habe an deinem Code nichts verändert nur eben die Bordnummer und ich benutze die Standartgrafiken also müsste der angegeben Pfad ja eigentlich stimmen... Oder hab ich noch irgend eine Änderung übersehen die ich noch hätte machen müssen?

LG Nema

mkkcs

upps, tausch mal das {imagefolder} gegen images, dann geht es

(habs auch oben geändert ..)

hatte den SQL aus dem Lite exportiert, und da wird es halt mit {imagefolder} angesprochen, hihi

-> http://test235.grafix-board.de/thread.php?threadid=4

Nemera

Daaaaanke, danke vielmals!
Es funktioniert perfekt, bist mein Held der Woche

LG Nema

Forensoftware: Burning Board, entwickelt von WoltLab GmbH