PDA

View Full Version : help with Spoiler Tag codes


daboogas94e
08-07-2007, 09:33 PM
I would be very appreciative if someone could point to where the Spoiler tags are at or what the code is for vB 3.6.8

TIA

towermatt
08-07-2007, 10:51 PM
This is what I have

Under "custom bbcode" in the admin cp choose "add new code:

Title:Spoiler
Tag: spoiler
Replacement:
<center><font color="red">Spoiler Below</font></center> <div class="spoiler">{param}</div>
Example: test
Description: Hides Text

I have "use option" set to no.

The image I am using is: http://img461.imageshack.us/img461/4144/spoilervu8.gif

but I am not too happy with it, its a little big

bobster65
08-07-2007, 10:56 PM
I would be very appreciative if someone could point to where the Spoiler tags are at or what the code is for vB 3.6.8

TIA

Im not a huge fan of all the spoiler tags that require buttons to activate the hidden text, nor can they be used within a paragraph of text multiple times, so I wrote one that you can place the tags around the text within a paragraph (multiple times if you wish) and all one has to do is MOUSE OVER each one to reviel the hidden text. The reason I say "each one" is that you can have a review with multiple spoiler tags within the review and each one is activated seperately upon mouse over.

2 Simple Steps

Step 1 - Add new BB Code as follows:

Title: Spoiler
Tag: spoiler
Replacement: <span class="spoiler" onmouseover="this.style.color='#FFFFFF';" onmouseout="this.style.color=this.style.backgroundColor='#0000 00'">{param}</span>
Example: Stuff goes here
Description: The spoiler tag will hide the text between the tags, and will appear only when you put your mouse over the hidden text.

Step 2 - Add an Additional CSS Definition

Edit the Style(s) that you wish to apply this too .... (Style Manager >> All Style Options) scroll down towards the very bottom of the Options and you will see an area for "Additional CSS Definitions " Enter the below code to the end of the Additional CSS Definitions

.spoiler
{
color: #000000;
text-decoration: none;
background-color: #000000;
}

Thats all there is too it.