MyBB Community Forums

Full Version: Dual MyCode Spoiler
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
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 Smile
Try this 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>
and see if ' works or you could use &#39; to get this '