Spoiler Tag

[ChopSuey]

Title: Spoiler Tag

BBCode Tag Name: spoiler

Replacement:<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color="red"><b>&nbsp;</b></font></right>
<input type="button" value="Show Spoiler" style="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: testing testing

Descpription: Hide large images or just text.

Set all options to NO (If any options have yes selected, it will not work. Enjoy!

---------------------------------------------------------------------------------------------------------------------
It at first says, "Show Spoiler" - "Hide" - After clicking it just says "Show"

[Boofo]

Any pics of this in action, both open and closed?

[sulasno]

tagged and thanks

edit

untag and installed

[ChopSuey]

I'll post up pics later.

[ChopSuey]

We have discussed it in PM already. You and some other anonymous person are accusing me of stealing code, which myself would never do.

[Bigj85]

your code

<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color="red"><b>&nbsp;</b></font></right>
<input type="button" value="Show Spoiler" style="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>


code from this spoiler https://vborg.vbsupport.ru/showthread.php?t=184855&highlight=spoiler

<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px"> <u>Spoiler</u>:
<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>



a tiny difference in the style is all I see <div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color="red"><b>&nbsp;</b></font></right>

I'm just saying :rolleyes:

[ChopSuey]

I didn't edit out my first post to change it. Told you already i have talked to the person who made the "other" code.

[hqlman]

Says show spoiler even after opening the spoiler, somethings not right in the code

[210665]

<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color="red"><b>&nbsp;</b></font></right>
<input type="button" value="Show Spoiler" style="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>

how can I center on this product

[ChopSuey]

I will update the code....sorry.

[ChopSuey]

Code updated, have all options set to NO!

Example in a thread http://forum.vbdiscussions.com/showthread.php?t=7701

http://forum.vbdiscussions.com/showthread.php?t=8262

http://www.urbanreply.com/showthread.php?t=3272

Works perfect! Just make sure any options are set to no.

[hqlman]

The last URL you gave still has the same problem, when you click the button to show spoiler, shouldnt the text change to hide spoiler? instead of still saying show spoiler :confused:

[ChopSuey]

It works fine in FF.

[MRGTB]

All you've done is copy this hack from MyBB

http://community.mybb.com/thread-70319.html?highlight=spoiler

Compare the main code and see.

I used that hack before when I ran MyBB 1.4, so spotted this as looking the same right off. You've made a few changes that's all to suit vbulletin, but the main Spoiler Code used is exactly the same.

Your code:

<input type="button" value="$1" style="width:auto;font-size:12px;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 = '$3'; } else { this.parentNode.parentNode.getElementsByTagName('d iv')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = '$1'; }" />

MyBB Code:

<input type="button" value="Show Spoiler" style="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'; }">

[ChopSuey]

I didn't copy it from MyBB, (i have no reason to go over there either) i don't copy things. If i we're to do that why would i even bother posting my work. Why you accusing me of such things? If thats what you think than idgaf anyways. I didn't copy it from anyone, made it long ago on my gaming site and decided to post it.

[Dr.osamA]

installed

thanxxx

[Gero50]

Worker perfect thanks a lot for the code help.

[LatinoCheats]

And how do I change the background of the Spoiler? That is, change the background where writing the occult? Thanks!

[bozonessinc]

And how do I change the background of the Spoiler? That is, change the background where writing the occult? Thanks!
Unfortunately, ChopSuey and the writer of this thread, has passed away in a suicide, there is a memorial thread in the main section.

I would assume this mod is no longer supported.

RIP ChopSuey

[ndut]

nice.. thank you

[homanhtruong]

thanks. installed

[BirdOPrey5]

And how do I change the background of the Spoiler? That is, change the background where writing the occult? Thanks!

To remove the background color delete the class="alt2" from the code.

To change to a different color add a background color to the style attribute... such as:


<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color="red"><b>&nbsp;</b></font></right>
<input type="button" value="Show Spoiler" style="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 style="margin: 0px; padding: 6px; border: 1px inset; background: red;">
<div style="display: none;">
{param}
</div>
</div>
</div>


The only line changed was the second to last <div> tag... in this case from:
<div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;">
to:
<div style="margin: 0px; padding: 6px; border: 1px inset; background: red;">

[PreciseDemise]

We've been using this for some time without problem, but it has recently it has stopped working, possibly due to the latest update of vB(4.0.5)
<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px; width:852; height:26"><right><font color=#bb0000><b>&nbsp;</b></font></right>
<input type="button" value="Show Spoiler" style="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>
Any advice?

[BirdOPrey5]

BB Code is just HTML, as long as {param} is there it should work in any VB version... I would try deleting the code and re-adding it, maybe something got corrupted along the way but it should work just fine.

[ZEHH]

Spoiler tag is not working in Firefox browser, any solution?

[PreciseDemise]

Spoiler tag is not working in Firefox browser, any solution?

So it's not just us then ...

[BirdOPrey5]

It's working fine for me in Firefox-
http://www.juot.net/forums/showpost.php?p=848436&postcount=2

Does it work for you guys on my site/link?

[PreciseDemise]

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET CLR 1.1.4322)
Timestamp: Sun, 15 Aug 2010 12:07:38 UTC


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working

Details from Firebug/Firefox Error console. Maybe it'll help ...

@BirdofPrey; Your using an old version(v3.8.6) of vB not v4.0.6, that is the difference dude =\

[your24hourstore]

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET CLR 1.1.4322)
Timestamp: Sun, 15 Aug 2010 12:07:38 UTC


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working

Details from Firebug/Firefox Error console. Maybe it'll help ...

@BirdofPrey; Your using an old version(v3.8.6) of vB not v4.0.6, that is the difference dude =\ the author is no longer with us as of last month , there will be no updates to chop sueys mods as he is deceased

[BirdOPrey5]

User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0; Trident/4.0; SLCC1; .NET CLR 2.0.50727; Media Center PC 5.0; .NET CLR 3.5.30729; .NET CLR 3.0.30729; .NET4.0C; .NET CLR 1.1.4322)
Timestamp: Sun, 15 Aug 2010 12:07:38 UTC


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working


Message: 'this.parentNode.parentNode.getElementsByTagName(. ..).1' is null or not an object
Line: 1344
Char: 1
Code: 0
URI: http://www.dbc-forum.net/showthread....topped-working

Details from Firebug/Firefox Error console. Maybe it'll help ...

@BirdofPrey; Your using an old version(v3.8.6) of vB not v4.0.6, that is the difference dude =\

1) BB Codes work exactly the same in 3.8 as 4.0
2) I have a test install of 4.0.4 and it also works fine with FF on that

Can you try it with the default style- maybe something in a custom style is conflicting

Also can you post line 1344 (and neighboring lines) from the page source that generated that error? (or whatever lines around the error the next time you go to that page).

[Michlerish]

Stopped working for me as well, I can see the spoiler (closed), but can't open it once post is submitted. Nothing happens when I click on the spoiler button.

[BirdOPrey5]

Stopped working for me as well, I can see the spoiler (closed), but can't open it once post is submitted. Nothing happens when I click on the spoiler button.

Is this after upgrading to 4.0.6?

[ZEHH]

Is this after upgrading to 4.0.6?


Would complete the bbcode to work perfectly in Firefox?

My version is 4.0.5

[BirdOPrey5]

For me it's working fine in all browsers in 4.0.4- while I wold be surprised if upgrading to 4.0.6 breaks it, nothing with vbulletin shocks me anymore... I will try and upgrade my test install and check it.

[cloferba]

when there is more than 1 spoiler...you can see only one...and the other doesnt expand itself

[BirdOPrey5]

when there is more than 1 spoiler...you can see only one...and the other doesnt expand itself

I'm just not having these issues... just tried a page with 3 spoilers on it in IE/FF/Chrome and they all worked fine. :confused: Are you on 4.0.6 also? I'm using 4.0.4 to test.

[chocothunda]

Where do you type that code in?

[BirdOPrey5]

Admin CP-> BB Code Manager -> Add New BB Code

[Zombo]

yeah im pretty sure upgrading to 4.0.6 breaks it,

i just upgraded and it broke.

[BirdOPrey5]

I upgraded to 4.0.6 and it's still working fine for me... I have the default style though, everything very basic.

To those have say it broke in 4.0.6 are you using the forum only or the suite? I'm testing on forum only.

[Afsoul]

Thx, this is very helpfull for me :D

[Pro-eSports.com]

Working fine on 4.0.7.

Provide an editor image please.

[BirdOPrey5]

Working fine on 4.0.7.

Provide an editor image please.

This is what I used when I still had a button for it.

[pwner318]

Finally! Works great,mark as installed.

[broncoshq]

Since moving to SSL, this has stopped working on our forum. It shows up, but it won't display the content when clicked.

Any ideas?

[tini_lam]

how to hiden content in spoiler by guest?

[BirdOPrey5]

You can't prevent guests from seeing content with any basic BBCode- you'll need some kind of plugin for that.

[Cem01]

I am looking for this everywhere. Thanks, it works fine!