Spoiler MyCode / Bild einfügen.

Spoiler MyCode / Bild einfügen. - Druckversion

+- MyBB.de Forum (https://www.mybb.de/forum)
+-- Forum: Sonstiges (https://www.mybb.de/forum/forum-1.html)
+--- Forum: Programmierung (https://www.mybb.de/forum/forum-32.html)
+--- Thema: Spoiler MyCode / Bild einfügen. (/thread-30794.html)

Spoiler MyCode / Bild einfügen. - Itunes - 20.10.2014

Code:
<div>

<input type="button" value="Zeigen" style="width:80px;background-color:#356EFF;border-color:#356EFF;border-radius:7px;color:#fff;font-size:12px;margin:5px;padding:2px;" 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 Spoiler'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Zeigen';}">

    </div>

    <div>

        <div style="background: #ddd;margin: 0 15px 15px 15px;padding: 5px;border: 1px solid #858585;display: none;">

$1

</div>

    </div>

</div>

Hallo, so sieht momentan mein MyCode für den Spoiler aus, jetzt habe ich allerdings ein Problem.
Und zwar, möchte ich jetzt anstatt dem Button ein postbit.

Code:
<img src="images/elegantblue/postbit_spoiler.gif"

So, jetzt bin ich aufgeschmissen, habe da schon etwas rumprobiert aber hab es nicht geschafft das es funktioniert und das postbit angezeigt wird..

Hoffentlich kann mir hier jemand helfen Toungue

Mit freundlichen Grüßen

RE: Spoiler MyCode / Bild einfügen. - MrBrechreiz - 21.10.2014

Verstehe ich fas richtig, du möchtest deinen Beitrag in einen spoiler haben ?

RE: Spoiler MyCode / Bild einfügen. - Itunes - 21.10.2014

Nein Big Grin

Ich hab hier ein "Bild"

.gif

postbit_spoiler.gif (Größe: 1,33 KB / Downloads: 80)

Und das soll der Button für den Spoiler werden also, wenn man da rauf klickt soll sich der Spoiler öffnen.

So, momentan erstellt sich der Button ja sozusagen selbst, das will ich aber nicht, ich will das die das Bild suchen aus /bilder/postbit_spoiler.gif und das Bild dann anstatt diesem, Button da ist.

Momentan sieht der Code ja so aus:

Code:
<div>

<input type="button" value="Zeigen" style="width:80px;background-color:#356EFF;border-color:#356EFF;border-radius:7px;color:#fff;font-size:12px;margin:5px;padding:2px;" 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 Spoiler'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Zeigen';}">

    </div>

    <div>

        <div style="background: #ddd;margin: 0 15px 15px 15px;padding: 5px;border: 1px solid #858585;display: none;">

$1

</div>

    </div>

</div>

In dem Ausschnitt unten wird ja sozusagen der Button erstellt, das soll jetzt weg und anstatt das der Button erstellt wird, soll das Bild einfach geladen werden.

Code:
<input type="button" value="Zeigen" style="width:80px;background-color:#356EFF;border-color:#356EFF;border-radius:7px;color:#fff;font-size:12px;margin:5px;padding:2px;

Jetzt nochmal in kurz mit Bildern, ist vielleicht verständlicher Big Grin

So sieht momentan der Button aus, der erstellt sich selbst, das ist kein Bild:

Und anstatt dem Button soll ein Bild nämlich das:

.gif

postbit_spoiler.gif (Größe: 1,33 KB / Downloads: 80)

RE: Spoiler MyCode / Bild einfügen. - MrBrechreiz - 21.10.2014

Sorry, aber selbst mit deinen gefühlten 50 Zeilen Text, weiß ich noch immer nicht was Du möchtest.

RE: Spoiler MyCode / Bild einfügen. - Itunes - 21.10.2014

Mal ganz kurz, vielleicht verstehst du es dann Big Grin

Anstatt dem Button:

möchte ich den hier als Button

.gif

postbit_spoiler.gif (Größe: 1,33 KB / Downloads: 60)

So sieht der MyCode für den Spoiler aus: (Also die "Ersetzung")

Code:
<div>

<input type="button" value="Zeigen" style="width:80px;background-color:#356EFF;border-color:#356EFF;border-radius:7px;color:#fff;font-size:12px;margin:5px;padding:2px;" 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 Spoiler'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Zeigen';}">

    </div>

    <div>

        <div style="background: #ddd;margin: 0 15px 15px 15px;padding: 5px;border: 1px solid #858585;display: none;">

$1

</div>

    </div>

</div>

Und ich möchte nicht den Farbcode ändern, sondern das zweite Bild da drin haben.

Der User SvePu hat mir bereits per PN erfolgreich geholfen!

RE: Spoiler MyCode / Bild einfügen. - SvePu - 22.10.2014

Da ich jetzt hier antworten kann, nochmal die Vorgehensweise für alle.

Es ist meiner Meinung nach nicht die optimale Lösung (hätte es eher per CSS gelöst) aber es funktioniert:

Code:
<div>

<input type="button" value="" style="background:url(images/postbit_spoiler.gif) no-repeat;width: 58px;height: 20px;margin-bottom: 5px;border: none;" 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.value = '';}">

   </div>

   <div>

       <div style="background: #ddd;margin: 0 15px 15px 15px;padding: 5px;border: 1px solid #858585;display: none;">

$1

</div>

   </div>

</div>