My favorite BB code - A javascript spoiler

[dchapman]

This is by far the most useful BB code I have ever used. It is used heavily on every one of my forums, including dev forums. It's a javascript spoiler.

Title: Spoiler

Tag: Spoiler

Replacement:


<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px"><b>Spoiler</b> for <i>{option}</i>: <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('d iv')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('d iv')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }">
</div>
<div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;">
<div style="display: none;">
{param}
</div>
</div>
</div>

Example: He Gets Killed!

Description: Use this to hide important information which might spoil a movie, program, etc for other users.

Use {option}: Yes


Screenshots

Example code:
http://img3.zoints.com/screens/s1.png

Spoiler in its closed state:
http://img3.zoints.com/screens/s2.png

Spoiler when open
http://img3.zoints.com/screens/s3.png

Images CAN be hidden within this :)

[Noppid]

Very nice. I have seen many requests for this.

Thanks

[Peggy]

I think someone, semann I think it was, posted something like this in his bb codes thread.

[Noppid]

You are correct. As with everything, there is more then one way to skin a cat. Both are very good ways to get the job done.

[Norman]

Yes, I use that, maybe a bit different. My code is this:


<div style="margin:5px 20px 20px 20px">
<div class="smallfont" style="margin-bottom:2px"><b>Spoiler:</b> <input type="button" value="Mostra" style="width:80px;font-size:10px;margin:0px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(' div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('d iv')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Nascondi'; } else { this.parentNode.parentNode.getElementsByTagName('d iv')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Mostra'; }"></div>
<div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;">
<div style="display: none;">
{param}
</div>
</div>

[KW802]

... but do any of these methods work with the thread preview?

[louisianna]

hmm. i can't quite get this to work either. i'm running 3.6.2 maybe i don't have something checked or turned on to get it to work?

[hakan_72_123]

Very nice.Thanks

[towermatt]

Wonderful bit of code, works great!

[windows vizta]

Nice thread! but i don't know where can i put it in?

[Arrogant-One]

Wonderful bit of code, works great!
Agreed. I love this new bb spoiler code. Thanks heaps. I'd click install if there was an install icon.

[Arrogant-One]

I have a question.

Can I have multipe tags to make the spoiler work?

For instance, presently its

[spoil=Puzzle] Answer to Puzzle [/spoiler]

I would prefer an additional tags, being:

Whatever

Or for posters to have the option and put:

32 45 89

If they want to.

Is this possible?

AO

[Arrogant-One]

I have a question.

Can I have multipe tags to make the spoiler work?

For instance, presently its

Answer to Puzzle

I would prefer an additional tags, being:

Whatever

Or for posters to have the option and put:

32 45 89

If they want to.

Is this possible?

AO

Guys,

Any help to my query above would be appreciated. Basically I just want the spoiler tags to work when someone types
The answer is 13

or

when they type

The answer is 13 .

Is this possible? Please, somebody?

[TipTopMan]

Thanks I just installed this now and it works very nicely :)

One of the best Spoiler codes I have seen.

[FelipeVieira]

how do i install this?