Fangs404
02-29-2012, 11:00 PM
I posted this version of the spoiler BB code for vB 3.7 and 3.8, and it was well received, so I figured I'd bring it to vB 4, too.
Having been a member of Something Awful for a while, I've grown to really like their spoiler BB code. Reddit has the same spoiler code. I searched around, but I couldn't find a similar spoiler for vB. Every single spoiler tag I saw requires that you either click a button (which doesn't allow inline spoilers) or highlight text (which requires unnecessary work). I wanted to mimic SA's and Reddit's simple spoiler code on my forum, so this is what you see here. This mod is completely theme-independent (it's just a BB code, nothing else!), and it'll keep your site W3C compliant.
Without hovering, you see nothing but black:
https://vborg.vbsupport.ru/attachment.php?attachmentid=88188&stc=1&d=1224134837
However, when you hover the mouse over the black section of text, it magically appears:
https://vborg.vbsupport.ru/attachment.php?attachmentid=88187&stc=1&d=1224134837
Title: Spoiler
BB Code Tag Name: spoiler
Replacement: <span style="color: #000000; background: #000000;" onmouseover="this.style.color='#FFFFFF';" onmouseout="this.style.color='#000000';">{param}</span>
Example: THIS TEXT IS SPOILERED LOL
Description: This tag changes the text into a black box which is unreadable. If you hover the mouse over the black box, the text will magically appear.
Use Option: No
Image: https://vborg.vbsupport.ru/attachment.php?attachmentid=136770&stc=1&d=1330717187
Note: Depending on your template, you may need to change the colors in the HTML replacement code. Just make sure that color, background, and onmouseout match and that onmouseover is different. The colors in the above code should work just fine for styles with a light background and dark text.
Having been a member of Something Awful for a while, I've grown to really like their spoiler BB code. Reddit has the same spoiler code. I searched around, but I couldn't find a similar spoiler for vB. Every single spoiler tag I saw requires that you either click a button (which doesn't allow inline spoilers) or highlight text (which requires unnecessary work). I wanted to mimic SA's and Reddit's simple spoiler code on my forum, so this is what you see here. This mod is completely theme-independent (it's just a BB code, nothing else!), and it'll keep your site W3C compliant.
Without hovering, you see nothing but black:
https://vborg.vbsupport.ru/attachment.php?attachmentid=88188&stc=1&d=1224134837
However, when you hover the mouse over the black section of text, it magically appears:
https://vborg.vbsupport.ru/attachment.php?attachmentid=88187&stc=1&d=1224134837
Title: Spoiler
BB Code Tag Name: spoiler
Replacement: <span style="color: #000000; background: #000000;" onmouseover="this.style.color='#FFFFFF';" onmouseout="this.style.color='#000000';">{param}</span>
Example: THIS TEXT IS SPOILERED LOL
Description: This tag changes the text into a black box which is unreadable. If you hover the mouse over the black box, the text will magically appear.
Use Option: No
Image: https://vborg.vbsupport.ru/attachment.php?attachmentid=136770&stc=1&d=1330717187
Note: Depending on your template, you may need to change the colors in the HTML replacement code. Just make sure that color, background, and onmouseout match and that onmouseover is different. The colors in the above code should work just fine for styles with a light background and dark text.