Better Spoiler bb code

[Ezo]

Hello, i had to post this for a friend,
Enjoy it.


Code made by ilT

My site:
http://somewhereyoubelong.com

No Title
Title: Spoiler (No Title)
Tag: spoil
Replacement:

<div id="spoiler"><div><input type="button" value="Show Spoiler!" style="width:100px;font-size:12px;margin:10px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(' div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Hide Spoiler!'; } else { this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = ''; this.innerText = ''; this.value = 'Show Spoiler!'; }" />
<div id="show" style="background-image:url(http://img37.picoodle.com/img/img37/5/11/7/f_backgroundm_872c796.png); display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-style:solid;border-width:1px; padding: 4px; width:98%">
{param}</div>
<div id="hide"></div></div></div>

Example: Some text
Use Option: No

With Title
Title: Spoiler (With Title)
Tag: spoil
Replacement:
<div id="spoiler"><div><font size="4">{option}</font><input type="button" value="Show Spoiler!" style="width:100px;font-size:12px;margin-left:10px;margin-bottom:3px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(' div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'Hide Spoiler!'; } else { this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = ''; this.innerText = ''; this.value = 'Show Spoiler!'; }" />
<div id="show" style="background-image:url(http://img37.picoodle.com/img/img37/5/11/7/f_backgroundm_872c796.png); display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-style:solid;border-width:1px; padding: 4px; width:98%">
{param}</div>
<div id="hide"></div></div></div>

Example: Some Text
Use Option: Yes

Screenshot
https://vborg.vbsupport.ru/external/2007/11/9.png

[yoyoyoyo]

thanks much - here is the image so people can upload it to their own server. Can the hidden text be viewed in archive mode?

[Magnumutz]

Just change the image with anything you want...
All i can say is that it's pretty nasty from him to add such a background.

[puertoblack2003]

no go error

Warning: sprintf() [function.sprintf]: Too few arguments in includes\class_bbcode.php on line 1115

[LlanMan]

I get this error also.

Other than that it looks good.

[projectego]

Very, very cool. I like it. :)

* projectego clicks install

[TWTCommish]

Does this function properly with multiple spoilers in a single post? I hacked my own board for somethign similar, but ran into that particular hurdle.

[liquidrage]

The problem with this is the spoilers are shown in the mouse over even since the replacement doesn't take effect until they view the thread.

[superthang]

can someone tweak this into so that we can use our own images?
like we can supply our own little thumbnail for each spoiler ?

thanks

[techgsmnet]

can someone tweak this into so that we can use our own images?
like we can supply our own little thumbnail for each spoiler ?

thanks

you about backgrount picture?
Just change picture link to you.

[SamuraiNigel]

So, this looks like something I want, but I don't know what to do with the code. Do I throw this into a template? Which one? Do I replace what's in the template or add to it? There aren't any instructions here that i can see...

Edit: Nevermind, I figured it out.

[superthang]

you about backgrount picture?
Just change picture link to you.

no, i mean like can we supply each with different image so user can click on that image and it show something related to that image

example
content content content about car

content content content about boat

and so on.

also got this error: style is not "null" or an object

[vasek]

added custom title on button:
add new BB code:

Title: Spoiler with custom text on button
Tag: spoiler2
<div id="spoiler"><div><input type="button" value="{option}" style="width:160px;font-size:12px;margin:10px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(' div')['show'].style.display != '')
{
this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = '';
this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = 'none';
this.innerText = '';
} else
{
this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = 'none';
this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = '';
this.innerText = '';
}" />
<div id="show" style="display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-style:solid;border-width:1px; padding: 4px; width:98%">
{param}</div>
<div id="hide"></div></div></div>

sample: hidden text
use option: On

[steve1966]

ok i managed to figure out how to install but when i click on my custom button on the tool bar I a get a pop up same as insert an image

and when i post the what i have inserted into the box i cannot get the hid show to show up
please can someone tell me what i have done wrong

[tintructo]

hi can someone tell me what template to add this code to thanks

or if i have to add this mod code somewhere else please can you give me a an instruction how to install

thanks

AdminCP -> Custom BB Codes -> Add New BB Code

in the title input , put something like "Spoiler"
in the tag input, put something like "spoiler" so you will have the bbcode like this : text
in the replacement textarea, put the code of the spoiler that you can see on the thread

and that's all :)

[steve1966]

its ok i have sorted it now and got it working

[mikkitine]

Multiple spoiler tags won't open after the first spoiler tag has been open regardless of whether they were used in the same post or not. This happens on IE/Safari browsers afaik.

[tjsrachel]

added custom title on button:
add new BB code:

Title: Spoiler with custom text on button
Tag: spoiler2
<div id="spoiler"><div><input type="button" value="{option}" style="width:160px;font-size:12px;margin:10px;padding:0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(' div')['show'].style.display != '')
{
this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = '';
this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = 'none';
this.innerText = '';
} else
{
this.parentNode.parentNode.getElementsByTagName('d iv')['show'].style.display = 'none';
this.parentNode.parentNode.getElementsByTagName('d iv')['hide'].style.display = '';
this.innerText = '';
}" />
<div id="show" style="display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-style:solid;border-width:1px; padding: 4px; width:98%">
{param}</div>
<div id="hide"></div></div></div>



sample: hidden text
use option: On

I am using this one for the custom text on the button but after you press the button the text disappears and does not come back. Anyone have any ideas how I can get the text to stay after selected?

[gibigbig]

works nicely
i customized it for my site

[Coldhands]

Found a bug!


Spoilers can be used to lure people to phishing sites.

Allow me to demonstrate:

If you have spoilers on your forum, post this and click on the spoiler.

Ohhh Wows! Check this out yous guys!!1
Okay, now click it and watch j/k! :) (http://www.vbulletin.org.forum.google.com/omgwhatisurpword)


Any suggestions on how to fix this lil bug?

[Coldhands]

Bump.

This hack does make vB vulnerable to steal passwords via phishing. At the minimum, people should know that clicking on a spoiler button shouldn't open a new window. On a fast enough phishing server, the user may not even notice (assuming the phishing server served up already cached images).

tick tock

Also, you can't nest the spoilers in IE. If you put a spoiler inside of a spoiler it just craps out.

[MonkYZ]

I am using this one for the custom text on the button but after you press the button the text disappears and does not come back. Anyone have any ideas how I can get the text to stay after selected?

Same here. The title text usually dissapears... How can we fix it ?

[dimitrisvb]

by far the best spoiler tag i've seen up to now...
thanx :D

[dimitrisvb]

is this going to work with vb 4.0 ? :confused:

[Per1213]

This doesn't work in Chrome. Any plans to fix that?