dchapman
07-06-2006, 07:05 PM
This is by far the most useful BB code I have ever used. It is used heavily on every one of my forums, including dev forums. It's a javascript spoiler.
Title: Spoiler
Tag: Spoiler
Replacement:
<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px"><b>Spoiler</b> for <i>{option}</i>: <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>
Example: He Gets Killed!
Description: Use this to hide important information which might spoil a movie, program, etc for other users.
Use {option}: Yes
Screenshots
Example code:
http://img3.zoints.com/screens/s1.png
Spoiler in its closed state:
http://img3.zoints.com/screens/s2.png
Spoiler when open
http://img3.zoints.com/screens/s3.png
Images CAN be hidden within this :)
Title: Spoiler
Tag: Spoiler
Replacement:
<div style="margin:20px; margin-top:5px">
<div class="smallfont" style="margin-bottom:2px"><b>Spoiler</b> for <i>{option}</i>: <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>
Example: He Gets Killed!
Description: Use this to hide important information which might spoil a movie, program, etc for other users.
Use {option}: Yes
Screenshots
Example code:
http://img3.zoints.com/screens/s1.png
Spoiler in its closed state:
http://img3.zoints.com/screens/s2.png
Spoiler when open
http://img3.zoints.com/screens/s3.png
Images CAN be hidden within this :)

