2012-09-10, 06:02 PM
I looked everywhere for a spoiler button that looked like I wanted (button not link) and allowed custom user titles- and I really didn't want to add a plugin for it. I tried and tried to make it all happen with one MyCode, but I would up using two to accomplish having the ability to label my spoilers while retaining compatibility with the unlabeled version.
Title:
Spoiler(No Title)
Short Description:
Spoiler with default title.
Regular Expression:
\[spoiler\](.*?)\[/spoiler\]
Replacement:
<div><div style="margin-bottom:2px; font-size: 12px"><input type="button" value="Show" style="font-size:14px;margin:0px;padding:0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }">
</div>
<div class="alt2" style="margin: 0px; padding: 6px;">
<div style="display: none;">$1</div>
</div></div>
And for the titled spoiler:
Title:
Spoiler(With Title)
Short Description:
Extended spoiler with title.
Regular Expression:
\[spoiler=(.*?)\](.*?)\[/spoiler\]
Replacement:
<div><div style="height:20px;margin-bottom:2px; font-size: 12px"><input type="button" value="$1" style="font-size: 14px; margin: 0px; padding: 0px;" onClick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = '';this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = '$1'; }">
</div>
<div class="alt2" style="margin: 0px; padding: 6px;">
<div style="display: none;">$2</div>
</div></div>
Known Issues:
- These tags will not nest
- Apostrophes ' break the spoiler.
Enjoy
