BB Code - Spoiler Tag

[Pyrofyr]

Hey, decided to post this here, it's a spoiler tag, easy to use, and can be opened and closed. ;]

Very easy install since it's BB Code.

Title : Spoiler

Tag : spoiler

Replacement :


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

Example : Halo Thar~!

Description : Used to hide spoilers. Don't ruin the ends of movies, games, etc for those who haven't seen it yet!

Screenshot: Almost forgot it >.o;
http://img177.imageshack.us/img177/9454/spoilclosesu4.png
http://img143.imageshack.us/img143/9074/spoilopenua2.png

[Peggy]

These spoiler tags can be fun.
Thanks for posting it here.

[Pyrofyr]

No prob, I figure if you change the word Spoiler, you can even use them for other things as well, like hiding and expanding general content. So it can be an all around thing.

I'm gonna mess around with more BB Codes later on today and post what I come up with.

[Peggy]

Great, I'll be looking for it.

[protoss]

Tried the above code in 3 different styles including the vBulletin default style. It did not work. I could see three typos in the code, correcting these did not solve the problem.

line 4 getElements ByTagName <- extra space
line 5 getElementsByTagName('d iv') <- extra space
line 6 getElementsByTagName('d iv') <- extra space
line 9 1px inset ; <- extra space

:confused:

[Pyrofyr]

Don't think it makes much of a difference, but what version are you running? I'm using 3.6.4 and it works perfectly fine for me.

Oh, and if you took that out, it's not extra code.
I used it to fix a visual problem I was having before with it.

[louisianna]

hmm. can't get this to work either. I'm running 3.6.2

[protoss]

Tried the code on two separate installations. It does not work on either, in any style. 8 styles tested in IE6, IE7 and Firefox
Have installed a spoiler BB code from another Coder and it works immediately.

[XXP]

...Have installed a spoiler BB code from another Coder and it works immediately.

Cool. We can't get this one to work either. Where's the one that you found that does work?

Thanks!

[XXP]

Tried the above code in 3 different styles including the vBulletin default style. It did not work. :confused:

Here's the fix for it. It does need all those typos fixed as you [and the unseen "Oda"] have proven.

It also needs the crucial "{param}" tag to transfer the spoiler text to the bbcode handler. Here's the code w/ typos fixed and "param" in place:


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


It is pretty cool. Thanks to Pyrofyr for the nifty start.

[Angels]

Thanks for the changes, XXP, it works perfectly now.

[dieseL]

Sorry to sound stupid, but where do I put this code? :(
It's a great piece of code by the sounds of it!

[qryztufre]

under the custom BBCODE thingie in the ACP I think.

Just fill in the blanks provided there with what you see here and all should be well.

[dieseL]

Just noticed that bit, sorry xD
Thanks for the immediate reply :)

Great release

[Scamp]

Thanks for the code! It looks great.

I would like to add the spoiler tag to the list of buttons (ie wrap code, wrap php, etc..) on the editor. Would anyone have a hint on how to do that?

Thanks.

(Yeah, I'm new that this...)

EDITED TO ADD: Doh! It's an option on the BB code manager. Never mind.

[TipTopMan]

Great code buddy but can someone give me some help installing this please?

I dont know where to put all of the code.

Thanks

[Dave A]

Admin CP > Custom BB Codes (near the bottom in the left hand menu) > Add new BB codes.

[TipTopMan]

Admin CP > Custom BB Codes (near the bottom in the left hand menu) > Add new BB codes.And I just paste all of that in there? and nothing else?

[chumeo_di_hia]

Here's the fix for it. It does need all those typos fixed as you [and the unseen "Oda"] have proven.

It also needs the crucial "{param}" tag to transfer the spoiler text to the bbcode handler. Here's the code w/ typos fixed and "param" in place:


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


It is pretty cool. Thanks to Pyrofyr for the nifty start.

wow, thank so much! that's all i'm looking for! but how can i do to add this code to Admin CP. Thanks for help!

[alom.hossain57]

Car Wrap Ideas (http://exposeyourselfusa.com/ )
We are a Full Service Sign Shop who has been in the printing business since 1975. We provide in-house design, printing, fabrication and installation. Expose Yourself is the premier company for vehicle wraps and fleet graphics. Bringing together over 30 years of experience in the advertising and large format print industry, our team is ready to make your graphics needs a reality.